Full width of div.entry-content on frontpage only

Hi there,

1. You can use the Page Builder Container set to Full Width:

https://docs.generatepress.com/article/page-builder-container/

2. You can use a Header Element:

https://docs.generatepress.com/article/header-element-overview/

You will only need to enable the Merge with Content option:

https://docs.generatepress.com/article/header-element-overview/#merge-with-content

1.

I have set all padding to zero.

I want the zero padding only on my front page, which class should I use for front page only?

@media (max-width: 768px) {
div.entry-content {
    padding: 0px 0px 0px 0px;
    background: #ffffff;
}
}

Thanks

Can I remove the inside header padding, the pink padding, in the customizer, or do I have to remove this with CSS?

.inside-header {
    padding: 10px 0px 10px 0px;
}

https://imgur.com/ITZATP8

When I added a widget to the header, the top padding disappeared.

Why is my back button not displayed in the header?

https://imgur.com/WV5VSfD

And how do I remove the white space between the header and the page content?, it is not part of the Elementor element

https://imgur.com/D4j3yil

Hi, sorry for the many post, the thing is, that I do not think the header and navigation behave as you would expect from the settings.

Here are some examples

Navigation right, but the navigation stays left.
https://imgur.com/n1Ujj7j

Navigation alignment center, but stays left
https://imgur.com/WAME8BH

Navigation alignment right, but stays left.
https://imgur.com/beDRcJQ

Navigation before centered, stays left
https://imgur.com/fmjf7ME

What am I missing here?

1. Remove Padding from Home entry-content only:

@media (max-width: 768px) {
    body.home .entry-content {
        padding: 0px 0px 0px 0px;
        background: #ffffff;
    }
}

Rest of queries - do you have the Customizer > Layout > Header --> Navigation as Header enabled ? If so the Inside Header padding does not apply and neither will those presets.

Thanks for the code, regarding padding.

I have had the Navigation as Header enabled, but I thought I would like to give the normal navigation in header a try. But why can't I set the Inside Header padding, and why is it pink...

By goal is, as described in another topic, to have my menu and back button widget left right in one line and without the use for a top bar.

https://imgur.com/HsVX0Wp

The hook element would allow you to add your back button HTML inside the same container as the Navigation:

https://docs.generatepress.com/article/hooks-element-overview/

The inside_navigation hook will apply to desktop and mobile - as long as you do not have the mobile header enabled.

Once it is in the container we can provide some CSS to align the elements. We would need to see the site to help with that.

Regarding

1. Remove Padding from Home entry-content only:

@media (max-width: 768px) {
    body.home .entry-content {
        padding: 0px 0px 0px 0px;
        background: #ffffff;
    }
}

The code only works on the body.home with a div tag, body.home div.entry-content
but then it dosen't work on the rest of the pages...

Hi there,

Are you wanting to apply that CSS to the entire site? If so, just ditch the body.home part.

Are you wanting to apply that CSS to the entire site? If so, just ditch the body.home part.

No, just on the frontpage.

I can see that hooks is a very powerful tool, and with that, you can achieve anything on your web site, and is just the tool I need. I just wouldn't know what to put in the field for e.g the back button plugin?

I can see this considered basic knowledge, and really would like to learn this technique, so are there any tutorials on this part, what script you should use?

Best
Carsten

The use of hooks is very very interesting, does this mean that I can move items, div#item-meta, from my BuddyPress div#item-header to after the content using the generate_after_main_content hook?

Is this css ( linked here ) now working? Let us know so we can close of this requirement.

I would suggest raising a separate topic regarding hooks.