Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Positioning, overflow, scroll bar, etc…

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #25781
    davidliu
    Member

    Hi again everyone,

    I’m really confused here. Check out this page I’m working on: http://www.daveatwork.com/grace

    Been trying to figure out positioning, overflow and scrollbar properties (or rather, the containing element/div that carries those properties).

    In all the links, the navigation div scrolls when I resize the page width in the browser. What property will allow me to set it to fix and let there appear a horizontal bar instead? Let me rephrase it, how do I maintain the same look even when I resize the browser, and have a horizontal bar at the bottom?

    I’ve been fiddling with the positioning and overflow property (changing it to static, fixed, show, auto, etc) in all the divs that I can think of (body id, #nav, #container) and nothing changed.

    Another thing that I can’t figure out is this: check out the ‘Destinations’ link. I have the background-position property set to:
    #main-destinations {
    position:fixed;
    background-image:url(images/eiffel.jpg);
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:top center; <-the others has top left property
    overflow:hidden;
    }

    How can I have a top center property but still have it not scoll along with the page when I resize the browser? What is the recommended size for creating a large background website like this? And what about the background properties property?

    Thank you!

    #62353
    soap
    Participant

    Put EVERYTHING inside a "wrapper" div.

    EXAMPLE:

    Code:
    logo
    home
    YOUR CONTENT HERE

    Obviously don’t do the css in the html.

    The fixed size wrapper should handle the problem you’re having.

#62364
davidliu
Member

Thank you Soap!

I have inserted everything into a ‘wrapper’ called #container.

Regarding the navigation area, I think it’s because I set the width in % that is causing it to behave unpredictably. It’s not set to a fixed width, and not jumping around anymore.

Thank you!

#62366
soap
Participant

No problem. Good luck.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.