Site logo

Archived topic

Inner Pages header element showing on top of content instead of behind it

6 replies · Started by g_younes on September 10, 2019

Viewing posts 1–7 of 7

Hello. I wanted the content section to show on top of the header element in my content pages.

I was previously using this css:
.inside-article{
margin-top: -320px;
z-index: 10; //added today but still does not work
}

It was working, the content section was showing on top of my header element. Today I checked and for some reason, it stopped. I have tried changing z-indexes but it still doesn't work.

My header element contains the post title and featured image. Here is a page example: https://www.thedigitalarabs.com/biopharmaceuticals/

Hi there,

Remove that CSS and try this instead:

.separate-containers .site-main {
    margin-top: -320px;
}

Worked! Thank you

Well, just a follow up: it worked but the container is now stuck to the left of the screen, and I am not sure where I should apply the margin-left value for it to go to the middle a bit. Putting " margin-left: 100px;" inside the css you suggested is not working

Any reasons why you are using this CSS?

body .grid-container {
    max-width: 100% !important;
}

I thought you were giving me a CSS suggestion, just now realized it's a question.

I used that to try to fix something that didn't get fixed, so I deleted it.

I put "margin-left: 100px !important;" inside the original css tag you suggested above and it worked (only after adding !important to it, even after the useless css was deleted). So you can consider this as resolved. Thank you!

No problem :)

This archived topic is closed to new replies.