However I don’t want it to be a full width.
It should be just as wide as the rest of the site.
If I place the div before the header. And adjust the with in the CSS it looks perfect.
But it’s no longer responsive.
If I put it in the before header content. It’s responsive.
The whole bar is slightly to the left and right.
Not flush with the top and left margin of the header.
How do i get it flush with the left and top margin of the header?
this is the css i used:
Hi Mosche. If you add the code to the “Before Header Content” hook, the bar should line up with the header width. Try removing the “width” property from your style. If that doesn’t do it, can you post a link to your site so we can see what it’s doing? Thanks.
I’m currently running the website on a local test environment.
So unfortunately I can’t show the live version yet.
I’ve removed the width 100%
Then I realized that the spacing for the header was creating the gap, this time on both sides.
I reduced the header spacing to 0
And my bar sits neatly flush to the top and sides of my header.
And is responsive.
The only issue is that my Logo and header widget are also sitting flush with the sides of the header.
Which doesn’t look so well. But I can find a way to get around it.
As always. Many thanks for the support and quick response.