SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Guru
    Join Date
    Nov 2000
    Posts
    741
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Messy design with divs!

    On my layouts, I have a div with a height set. When I type text, it goes beyond this height and the dotted line outlining the div area cuts half way through this text. It all looks a bit messy.

    What do you do about this? Just alter the height for the div tag? But is this only necessary for design view?

    Am I making any sense? lol

    Jon

  2. #2
    SitePoint Enthusiast
    Join Date
    Dec 2007
    Location
    Oskarshamn, Sweden
    Posts
    83
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    Maybe you could just set a min-height instead of height? If you use min-height the div will expand when needed.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    But is this only necessary for design view?
    If you are talking about DW then it doesn't handle CSS in design view very well at all and you shouldn't really need to be using it. Just use code view and then preview in a real browser.

    As mentioned in the post above you shouldn't set heights on elements that you want to expand.

    Set a min-height if you need an initial height otherwise let the content dictate the height.

    IE6 doesn't understand min-height but you can use this fix:
    Code:
    .elementname{min-height:300px}
    * html .elementname{height:300px}
    IE6 already treats height as a minimum and will expand as required but needs the height to be hidden from other browsers hence the use of the star selector hack (* html).


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
  •