Background image call problem

Question

I simply can't find the correct way or working way to do this. I've made an alternative header and added an option with redux theme option to have the alternative header. I've also made a custom-css.php where i can enter some files which are output in header. This should override any css from style.css

the thing i need is really simple but whatever way i have used, it doesn't work

an example

.header-fixed { background: transparent url(assets/images/mix1.png) repeat-x; }

With this option it doesn't work and the image with chrome inspector doesn't exist. If i add a full path like

background: transparent url(wp-content/themes/theme-name/assets/images/mix1.png) repeat-x !important;

then it works, why, i am not sure. But i don't believe this is a right call.

Other examples

1. background: url( ."/assets/images/mix1.png";) repeat-x !important;

2. background: url( " ."/assets/images/mix1.png"; ") repeat-x !important;

3.background: url( " /assets/images/mix1.png) repeat-x !important;

4.background-image:url(."/assets/images/mix1.png"); background-repeat:repeat-x;

5. background-image:url(/assets/images/mix1.png); background-repeat:repeat-x;

And there were many more. So any tips pls

Answer 1

UPDATE: Added a third example to show you how to output the path inside a PHP string, per the source code you provided in the comments.

There's nothing wrong with having a full path in your CSS but you want to make sure the path is being dynamically generated by WordPress for the most consistent results.

In this case the get_template_directory_uri() and/or get_stylesheet_directory_uri() helpers will be handy. The one you use depends on whether you are building in a standard theme vs. a parent theme with support for child themes. You can read more about the differences here: https://codex.wordpress.org/Function_Reference/get_template_directory_uri

On with the code, based on the example which you claim to be working as expected:

// standard theme / parent theme asset example
background: transparent url(<?php echo get_template_directory_uri(); ?>/assets/images/mix1.png) repeat-x !important;

// child theme asset example
background: transparent url(<?php echo get_stylesheet_directory_uri(); ?>/assets/images/mix1.png) repeat-x !important;

In your specific case, try this:

// specific example from your source file (line 23)
.header-fixed {  background: transparent url(' . get_template_directory_uri() . '/assets/images/mix1.png) repeat-x !important;  }