WordPress.org

Ready to get started?Download WordPress

Forums

Static Header, Scrolling Body (10 posts)

  1. Photog
    Member
    Posted 2 years ago #

    Wondering if it's possible to keep the header stationary and just scroll the body of the blog. If so, what's the CSS to do it?

    http://thevicarioustraveler.com is the blog (very early development) and Easel is the theme being used.

    Thanks

  2. peredur
    Member
    Posted 2 years ago #

    Well, you can use position: fixed on the appropriate blocks, but you'll have to alter the structure of your HTML to get that to work, I think.

    Cheers

    PAE

  3. Photog
    Member
    Posted 2 years ago #

    Thanks. Yeah. Setting just position: fixed messes up a lot of the other formatting. If that's the only way to do it then it's a non-starter.

  4. peredur
    Member
    Posted 2 years ago #

    :-)

    Thought you might say that.

    It's the only way I know about; but someone else may know better.

    Cheers

    PAE

  5. esmi
    Forum Moderator
    Posted 2 years ago #

    position:fixed is only solution. and it can work. http://theartificers.co.uk/gallery/just-a-fish-out-of-water/

  6. peredur
    Member
    Posted 2 years ago #

    Oh yes. Or this:

    http://www.csszengarden.com/?cssfile=202/202.css

    But I think in photog's case it'd be a fair bit of work to do it, given the code he's got. What do you reckon?

    Cheers

    PAE

  7. Photog
    Member
    Posted 2 years ago #

    Wasn't questioning that it could work. Just wondered if there was another way without the additional coding. And there's not. I've managed to get it sorted, I think. Had to add some margins and put finite sizes on the header, description and menu but I think it works now. Did something similar with the sidebars as well so those are fixed in place now too.

    Another related question: Is it possible to make widgets fixed and not scrolling? The theme I'm using allows for widgets above the header and above the text body (see the words 'test' in a couple places). Can those be made to be fixed as well?

    Thanks.

    EDIT: That's pretty slick peredur, but beyond my coding skills. :-)

  8. esmi
    Forum Moderator
    Posted 2 years ago #

    Oh - I don't know. The basics are working just fine. Not sure what the "test" refers to in the upper left. Take off text-align:right in #footer and it will look better. Maybe add a little top margin or padding too. But then it depends on what the final layout is supposed to do. I'd say it's all just tweaking really.

  9. esmi
    Forum Moderator
    Posted 2 years ago #

    Can those be made to be fixed as well?

    Yes but be careful about fixing too much or the design will start to become fragile and break down easily.

  10. Photog
    Member
    Posted 2 years ago #

    The 'test' is a word in a text widget. As mentioned, this theme allows for widgets in more places than just the sidebars. My intent is to eventually have advertisements in those places. I'd like the widget to stay in place so the advert remains on screen when people scroll.

    Yes but be careful about fixing too much or the design will start to become fragile and break down easily.

    If I wanted to 'risk it' ;-), where would the CSS be modified? There's nothing in the style.css that I can see that deals with these text widgets.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.