#1
  1. No Profile Picture
    Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2001
    Posts
    12
    Rep Power
    0

    Help with making CSS overflow property cross-browser compliant


    I would like to create a <div> box with CSS that takes up 100% of the screen height - at a minimum. If there is enough content in the box to overflow it, I would like the box to expand downward to show this extra content.

    I have this functionality in IE 5-6. All I have to do is set the <div> box height to 100% in the CSS declaration. However, I understand that this only works because IE 5-6 incorrectly implements the overflow property (see <http://www.xs4all.nl/~ppk/css2tests/overflow.html>).

    However, as that page explains, in Netscape6/Mozilla1+, the content (correctly) overflows outside of the box and the box does not expand.

    Does anyone have a solution that works for me in both IE and NS/Mozilla? Thanks in advance.
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2002
    Location
    Inside the GNU/Hurd kernel
    Posts
    492
    Rep Power
    13
    To get this behaviour in Mozilla you can use: min-width:100%
  4. #3
  5. No Profile Picture
    Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2001
    Posts
    12
    Rep Power
    0
    Thanks, that's very handy! Of course, IE's implementation of the min/max-width and min/max-height declarations is so limited some have referred to it as silly. Sigh. Mozilla wins again (I've already had to compensate for the fact that IE incorrectly renders box borders).

    Thanks again.
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2002
    Location
    Inside the GNU/Hurd kernel
    Posts
    492
    Rep Power
    13
    min-height:100% will work in Mozilla,Konqueror and Opera.IE has a very bad implentation of CSS ,it supports only a small part and the part that it supports is implented very quirky.

IMN logo majestic logo threadwatch logo seochat tools logo