WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Static/Fixed/Scrolling Header (4 posts)

  1. scyberia
    Member
    Posted 2 years ago #

    I have a website:

    http://blog.scyberia.tk/

    I am trying to edit the CSS/header file so that the header stays fixed just like this website:

    http://www.lokeshdhakar.com/

    I've looked around the support forums and tried some code (example) but the problem is the title and tagline stick to the very left of the page and the page links stick to the very right of the page.
    I want them in the same place they are now, but they should scroll with the page.

    I'm using the theme Foghorn.

    Any ideas?

  2. djr_xr6
    Member
    Posted 2 years ago #

    Try the following CSS and see if it works for you.

    div#main {
        padding-top: 100px;
    }
    
    header#branding {
        position: fixed;
        width: 1090px;
        background-color: #f2f2f2;
    }
  3. scyberia
    Member
    Posted 2 years ago #

    Thanks for helping me!
    The code mostly works. The only problem is that on small screens the "Downloads" link at the end of the header does not show, and scrolling to the right doesn't work.

    Is there a way to fix this? If not, I guess I will have to be happy with this...

  4. scyberia
    Member
    Posted 2 years ago #

    Great! Fixed it.

    Here's the code I used:

    div#main {
        padding-top: 120px;
    }
    
    header#branding {
        position: fixed;
        width: 1110px;
        background-color: #f2f2f2;
    }

    Actually I have another question. The Foghorn theme is mobile-friendly so I don't use any mobile extensions. The problem is that the pages links don't wrap, so the Downloads link is cut off.

    Help? If not it's okay...just wondering.

Topic Closed

This topic has been closed to new replies.

About this Topic