Optimize Press 2 - Content Padding CSS?

by art72
1 replies
  • WEB DESIGN
  • |
Hey All,

I'm stuck!

I've added some CSS tweaks to make my header sticky, love the look and feel it offers, but my first blog post title is hidden behind the header!

Despite searching G and even running through everything in OP 2's "Tips and Tweaks" - I cannot seem to find anything to 'lower' my blog content from behind the 'sticky' header.

If you look at the site > idealleads.net you'll see my top post "Test Post 3" heading is not showing... it's actually hidden behind the sticky header.

How (or where?) would I pad this out to lower the blog content?

Thanks, this is driving me insane!

Art
Save
Save
Save
#content #css #optimize #padding #press
  • Profile picture of the author bubb
    Hi Art,

    When you use position: fixed; in CSS it takes the element out of the document flow so the header is no longer "in the right place" to "push" the rest of the content down.

    Probably the quickest and easiest way to get the first blog post from under the header is to apply a margin to it. Find the .main-content CSS selector in the file where you made the previous changes and just add the following line between the curly braces :

    .main-content{
    margin-top: 100px;
    }
    You can choose any value you require but I tried 100px and it looked OK for me. You might want to test this out on some mobile devices and see how it looks and adjust accordingly.
    {{ DiscussionBoard.errors[10774865].message }}

Trending Topics