Docs

[bcoplin]

I am trying to figure out how to remove the space at the top of the post page.

I have already used the code below. But I am still left with a space at the top which is the background color, I changed the background color to white but there is still a visible line on both the top and bottom. How do I get rid of that all together so I can build out posts just like the rest of my pages.

.single-post .entry-featured, .single-post .entry-header {
  display: none;
}

.single-post .x-section .x-container.max.width {
    width: 100%;
}
.single-post .x-container.max.width.offset {
  max-width: 100%;
  width: 100%;

The web page can be found at, http://1e6.c6d.myftpupload.com/2017/02/07/mens-breakfast/

I will add my credentials on another post following.

[bcoplin]

This reply has been marked as private.

[Nico]

Hi There,

Thanks for writing in.

Add this code below to remove the margins of your posts:

.single-post .x-container.offset{
    margin: 0px auto;
}

Check your Customizer > Blog > Layout to fullwidth to remove the container of your blog posts item.

Let us know how it goes.

Thanks.

[bcoplin]

So that gets rid of the lines. Thank you. Unfortunately it still seems to be bound by a box and not true fullwidth like normal pages.

Also…

How do I set a background image for all blog posts? It currently is white but when I go into Customizer > Layout and Design and change the background color nothing happens. I would like to be able to change it to a slight gradient.

[Lely]

Hi There,

Try adding this custom CSS:

.single-post .entry-wrap {
    padding: 60px 0 !important;
}

From checking, you have set maximum 800px width plus there’s a default 60px padding on content area and site max width is set to 1200px. Above CSS will set left and right padding to 0. Then you may remove the maximum 800px max-width set on ROW. You may adjust 0from suggested CSS because it is not recommended for your content to touch browser ends. See this:http://screencast-o-matic.com/watch/cbnQhT6hjM. As you can see, on frontend too, even if we set to 0 there are still spaces on left and right. That is because the content max-width is set to 1200px. This setting is on Appearance > Customizer > Layout and Design > Site Max width. But if you adjust the screensize, you can see it will be on edge.

Regarding background, I can see that you have added bacground image on the post settings. For us to see that background image, please add this CSS too:

.single-post div#top, .single-post .entry-wrap {
    background: transparent;
}

That containers have white background by default and it sits on top of the images. We have to set it transparent so we can see through the background image behind.

Hope this helps.

[Author]

Posts