Wordpress - the background image does not work with home_url ()


I have a number of background images I'm using on a WordPress site which is ready to move to production. I'm changing all the localhost absolute links in my style.css file. I've changed my code for a background image from this:

background: url('http://localhost:8888/wp-content/uploads/2017/07/homepagemain.jpg') center center no-repeat;

To this:

 background: url('<?php echo home_url(); ?>/wp-content/uploads/2017/07/homepagemain.jpg') center center no-repeat;

When I do this the image doesn't show up, not sure if I'm just using the wrong function but this works on my img links in my html. How can I fix this? Do I need to use get_the_post_thumbnail_url() to move the image edit into the admin area and away from the stylesheets? Any assistance appreciated.

I don't know why the other answers are making such a simple problem, so complex.

All you need to do is remove http://localhost:8888 from the image path, thus creating a relative link and it will work fine.

You also get the added benefit of it working on http and https protocols if you decide to change in future. All you need is:

background: url('/wp-content/uploads/2017/07/homepagemain.jpg') center center no-repeat;