Header not flush with top, too low on page

Resolved ALS Blogger
(@als-blogger)

10 years, 3 months ago

Hi,

Need help here. I am having difficulty finding out where to control the padding between the header and the top of the page. There is a huge gap. I have a child folder with CSS and template files. Can’t figure out where in my CSS I need to change so the header butts up against the top of the page.

Here is my site: http://als-ny.org/blog/

Here is the site it mimics and I’d like to match: http://als-ny.org/

Any help would be appreciated.

Thanks.

Viewing 9 replies - 1 through 9 (of 9 total)

batharoy
(@batharoy)

10 years, 3 months ago
Try This:
```
#main {
    margin: 0;
}

#primary {
    padding-top: 0;
}

#mainnavmenu ul {
    margin-bottom: 0;
}
```
Brian Harris
(@zgani)

10 years, 3 months ago
The CSS code you need is
```
@media screen and (min-width: 783px) {
   .masthead-fixed .site-main {
   margin-top: 0;
   }
}
```
Thread Starter ALS Blogger
(@als-blogger)

10 years, 3 months ago

I tried finding the CSS code. I couldn’t find it exactly. When I tried to just insert the code you suggested it didn’t work. Any suggestions? Maybe I did something wrong.
Brian Harris
(@zgani)

10 years, 3 months ago
In your child theme style.css you have the following code @line 3540 – 3542
```
.site-main .site-main {
     margin-top: 20px;
}
```
The code should be:
```
.masthead-fixed .site-main {
     margin-top: 0;
}
```
Thread Starter ALS Blogger
(@als-blogger)

10 years, 3 months ago

Thanks @zulfikar. I changed the CSS in the child style.css as you suggested. It didn’t work. Still the same spacing above the header.

Brian Harris
(@zgani)

10 years, 3 months ago

It seems to have worked as I view the site the gap is not there.

Have you tried clearing your browser cache?

Thread Starter ALS Blogger
(@als-blogger)

10 years, 3 months ago

Ahh. I did. It seems to be rendering correctly in Firefox but not Chrome. Is that a Chrome thing or do you think there’s additional code I need to add for that browser? Are you viewing it in Chrome?

Brian Harris
(@zgani)

10 years, 3 months ago

Works fine in Chrome, Opera and IE11 too.

Thread Starter ALS Blogger
(@als-blogger)

10 years, 3 months ago

OK. Thanks.

Viewing 9 replies - 1 through 9 (of 9 total)

The topic ‘Header not flush with top, too low on page’ is closed to new replies.

Tags