- This topic has 9 replies, 2 voices, and was last updated 4 years, 1 month ago by
.
-
Posts
-
I am running into an issue on a site where I have the body set to a more narrow width in order to accommodate a decorative right column on the site. But setting the header to merge seems to cause it to extend out beyond the narrower body and over the decorative column. Please watch this Loom Video I made showing the issue: https://www.loom.com/share/4ddc59fc68504b069ce22ae740a3f7ae. What can I do to solve this issue?
Thanks!
Customer Support
Hi Brent,
Can you link us to the site?
Ooops, sorry. Here is the link: https://wordpress-483838-2431328.cloudwaysapps.com/
Try this CSS:
.header-wrap .navigation-stick:not(.gen-sidebar-nav) { right: 14.2857% !important; width: calc( 100% - 14.2857%) !important; } body .header-wrap { right: 14.2857%; }Let me know 🙂
That CSS seems to have solved the issue! Thanks so much!
Actually, that CSS solved the issue on the front page where I have the header merge applied. But it didn’t solve the issue on other pages where the sticky menu still extends across the decorative right column. Any idea what I need to fix that issue? When I apply the header merge to the whole site, it is working okay on other pages. But if I don’t have header merge applied to a page, the sticky menu is still extending across the full width of the site.
For example: see this page: https://wordpress-483838-2431328.cloudwaysapps.com/style-guide/. The menu is now contained within the area where I want it until I scroll down and the stick menu kicks in. Then it is displaying the sticky menu full-width.
In that case, remove
.header-wrapfrom this CSS:.header-wrap .navigation-stick:not(.gen-sidebar-nav) { right: 14.2857% !important; width: calc( 100% - 14.2857%) !important; }Great, that seems to have solved the issue! Thanks!
You are welcome 🙂
- You must be logged in to reply to this topic.
