SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Wizard aaron.martone's Avatar
    Join Date
    Feb 2003
    Location
    Florida, USA
    Posts
    2,322
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Question Absolute position question

    I have a page at www.aaronmartone.com/css.html that I am currently working on the layout for.

    My line of thought is 1 master wrapper div, place 2 absolutely positioned divs in side that wrapper (the background left and background right), and then another absolute subwrapper div that is positioned in the middle with left:50% and a margin-left that is a negative value of half it's width (-385px), which contains 3 relatively positioned divs (the left, center and right columns).

    In my mindset, since the body, html are set to min-height: 100% and height: auto, all objects that were given that CSS property/value would expand to the page's actual height, but they don't seem to be.

    So I'm asking "do absolutely positioned divs "break" a wrapping div's ability to contain said div when the expanding div SHOULD expand the wrapping div, but instead seems to be just blowing right outside it?

  2. #2
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  3. #3
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  4. #4
    SitePoint Wizard aaron.martone's Avatar
    Join Date
    Feb 2003
    Location
    Florida, USA
    Posts
    2,322
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the response Kravvitz, I guess that would mean I should not use the background DIVs as absolute, otherwise they'll never expand to the page height.

    all4nerds-
    Your example there looks NEAR perfect, and I notice that you have effects happen as you roll over those text links, but after mousing over a couple times in Firefox, the background red and orange divs disappeared!

  5. #5
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello

    Works in IE 5 5.5 6 / FF 1.07 1.5b2 / NS 6 6.1 7.1 7.2 8/ Moz / OP 7 8 8.5 9

    IE 5 small drops on hover
    IE 5.5 bottom margin ?
    OP 7 8 8.5 compromise on the scroll bar issues

    Valid CSS and HTML

    Background images on hover are not dropping in my tests? anyway feel free to improve it

  6. #6
    SitePoint Wizard aaron.martone's Avatar
    Join Date
    Feb 2003
    Location
    Florida, USA
    Posts
    2,322
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Sorry, that was a snafu on my end. I had a setting on FF's Web Developer Toolbar enabled. Great example, thank you guys!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •