Site logo

Archived topic

Container width on some pages

8 replies · Started by Bernhard on May 18, 2019

Viewing posts 1–9 of 9

Hi,
on some pages I want to use a floating page navigation. I need therefore on these pages some more blank space on the left, on desktop view approx 20px, on mobile view approx 15px.
How can I configure this?

Hi there

we could do this with some CSS and a media query. But how do you set which pages has the floating navigation? And how is that function added?

Hi there

we could do this with some CSS and a media query. But how do you set which pages has the floating navigation? And how is that function added?

Hi David,
I use the Float Menu Pro plugin for this function and I can select the page ID to add the menu.

So for example this CSS would apply some extra padding to the page you provided a link to:

.page-id-19865 .site-content {
    padding-left: 60px !important;
}

But that would mean specifying this CSS for every page you add the float menu to.
If the Plugin could add a class to the Body to identify the Float Menus presence then this would save a lot of aggro. Do you know if this is an option? Maybe the author can advise.

Hi David,
It works, thank you. I can address these pages with Elements which is a really great tool. So this is not a problem.
One thing is that I want to define a different padding for desktop and mobile. How can I do this?

Awesome - yes love Elements :)

So without the specific page class this CSS:


/* Desktop */
.site-content {
    padding-left: 60px !important;
}

/* Mobile */
@media (max-width: 768px) {
    .site-content {
        padding-left: 40px !important;
    }
}

Perfect, thank you :-)

You're welcome

This archived topic is closed to new replies.