[jptrotierParticipant]

question :

[jptrotierParticipant]

This reply has been marked as private.

[jptrotierParticipant]

Also, how i can eliminate the gap between the menu (header) and the slider (first element on a page). Thanks

[jptrotierParticipant]

Why i can put an image background in the x-nav with this code :
.x-navbar .x-nav {
background-image: url(http://productionspolar.com/wpOCONNOR/wp-content/uploads/2016/04/back_topheader_LOL3.jpg);
}

But not work when i whant the image in the .x-navbar :
.x-navbar {
text-align: center;
background-image: url(http://productionspolar.com/wpOCONNOR/wp-content/uploads/2016/04/back_topheader_LOL3.jpg);
}

I can i put an image background in the back of the whole menu (only the x-nav) and how to put the text for the link center align ? Thanks again

[jptrotierParticipant]

Finally, it’s possible to have a background image in the topheader (topbar) area ?

[jptrotierParticipant]

Last one for today.. haved update the home page :http://productionspolar.com/wpOCONNOR/

how can I remove the white space between the topbar and menu ?

how can i remove the white space between the belowmasterhead image and the page (black section) (see attachments

how can i have an fullwith background image for the menu ?

Where can I find the list of the different class name for the design of X?
For example, I want to apply a CSS code for the topbar to activate a background image.

thanks a lot

[FriechModerator]

Hi There,

Thanks for writing in! It seems you already resolve couple of issue above? To add a background to the topbar, you can add the custom css below on the customizer.

.x-topbar {
	background-image: url('IMAGE URL HERE');
	background-repeat: no-repeat;
	background-position: center;
}

To remove the white space between the topbar and menu.

.x-logobar {display: none;}

Remove the gap between below masterhead and black section.

.x-container.offset {margin-top: 0;}

how can i have an fullwith background image for the menu?

We need to apply the background image on the navbar wrapper instead on the navbar itself.

.x-nav-wrap {
	background-image: url('http://productionspolar.com/wpOCONNOR/wp-content/uploads/2016/04/back_topheader_LOL3.jpg')
}

Use the inspect element tool of your browser and you’ll see the HTML markup of the page with the classes.

How To Use Inspect Element

Hope it helps, Cheers!

[jptrotierParticipant]

Thanks a lot !
Only one things not work.. This :
with this code :

.x-topbar {
background-image: url(http://productionspolar.com/wpOCONNOR/wp-content/uploads/2016/04/back_topheader_LOL3.jpg);
background-repeat: no-repeat;
background-position: center;
}

i can paste the code in the cornerstone of the page (custon css of the page) WORK
But when i paste the same code in the global CSS in the customizer (to affect all the topbar of all pages, did’nt work. Why ?

[jptrotierParticipant]

Finally, i want my topbar to have a 30px height background image.
Can i remove thw white gap under the topbar ?
Thanks a lot for the youtube link !

[FriechModerator]

Hi There,

That is weird, the code works on my test. Did you clear your browser’s cache before you preview the page? Would you mind providing us login credentials in private reply, so we can take a closer look.

In the meantime please update the code to this:

header .x-topbar {
background-image: url(http://productionspolar.com/wpOCONNOR/wp-content/uploads/2016/04/back_topheader_LOL3.jpg);
background-repeat: no-repeat;
background-position: center;
min-height: 30px;
}

The space below the topbar is the logo bar. Please use this custom css to get rid of it.

header .x-logobar {display: none;}

Hope it helps, Cheers! 🙂

[Author]

Posts