Hi.
My client has asked to make it possible to place the site logo (enola.be) to the left so it matches with the start af the menu, and to move the advertisement to the far right so it matches with the magnifying class on the far right.
I’ve searched and tried but nothing tends to work, at least not something that works on different screen sizes.
What I have added so far is this in the css theme panel, which already moved the menu to the far left and a width of 1600 px (which now matches nicely with the site contents).
Can you help me please with this one ?
.td-header-style-1 .td-mega-menu ul { position: absolute; left: 556px !important; }
.td-header-wrap .td-header-style-1 {max-width:1600px}
.td-header-style-1 .td-header-row {max-width:1600px}
.td-header-style-1 .td-header-main-menu {width:100%}
The link to the website is here: http://v2.enola.be/
And what we’re looking for in the end is this: 
Would also be great to see how this is done, I’ve just increased the width of the header section to 1200px in the ‘Force Full Width’ theme options but the header ad now floats somewhere in the middle rather than over to the right.
Hi,
@NickDeBaerdemaeker So maybe like this – https://www.screencast.com/t/1vFokKD1PaL
I removed the left margin of the logo and added the removed value to the right of it.
.td-header-style-1 .td-header-row .td-header-sp-logo {
margin: 28px 10px 9px 0px;
}
You can modify the value to the right if needed.
@bestword1 Hopefully the new header builder that is being developed will allow greater flexibility for designing a header style.
I can give you a code to position the ad to the right, you can use the other code from above if you want the logo aligned to the menu. This would be the result with both codes
– https://www.screencast.com/t/SeQAleFUVNxD
.td-header-style-1 .td-header-sp-recs {
float: right;
}
Thanks
Thanks Simion that’s worked perfectly, just what I needed. Looking forward to seeing the new header builder! 🙂
I had a few lines of code in the live css editor, so I finally came up with this to make it work.
.td-header-style-1 .td-mega-menu ul { position: absolute; left: 556px !important; }
.td-header-wrap .td-header-style-1 {max-width:1600px}
.td-header-style-1 .td-header-row {max-width:1600px}
.td-header-style-1 .td-header-main-menu {width:100%}
.td-header-style-1 .td-header-sp-recs {float: right;}
.td-header-row {width:100%}
.td-header-style-1 .td-header-row .td-header-sp-logo {margin: 28px 10px 9px 0;}
.td-header-style-1 .td-header-row .td-header-rec-wrap {margin: 0 0 0 180px;}
