Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Location
    Iowa / Notre Dame
    Posts
    538
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Div minimum height

    I have been having some problems with div's latley. To be honest, the site I am experimenting with currently, is my first ever site to incorporate div's. The problem I am running into is when I try and set the height of my div's. For really big div's I have no problem, but when I try to set a div's height smaller than something like 30px it just stays at a height somewhere around 30px. I don't notice any change at all in the size of the div when I set it's height to something less than 30 or so pixels.

    Here is my code--I tried to keep it simple enough for an example:

    <html>
    <head>
    <title>Trying div's</title>
    <style type="text/css">
    .bigline {position: absolute; top: 50px; height: 200px; background-color: #000000; width: 100%;}
    .smallline {position: absolute; top: 260px; height: 5px; background-color: #FFFFFF; width: 100%;}
    </style>
    </head>
    <body bgcolor="#999999">
    <div class="bigline"></div>
    <div class="smallline"></div>
    </body>
    </html>


    I also have one last question: is it bad to use too many divs? Right now I am planning on having something like 7 or so div's at max (this is a totally experimental project mind you) and I wasn't sure if using div's is something that I should try and limit.
    My Site {Mike's Adventures}

    Yikes, forums are almost too much fun.

  • #2
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Netherlands
    Posts
    217
    Thanks
    0
    Thanked 0 Times in 0 Posts
    There's absolutely nothing wrong with using many div's.
    You can set the maximum/minimum width/height with;
    min-width, min-height, max-width, max-height

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    Montreal, Canada
    Posts
    644
    Thanks
    0
    Thanked 0 Times in 0 Posts
    you can't make the height of the div smaller than the size of the font. Try using: font-size: 0px;

  • #4
    Regular Coder
    Join Date
    Jun 2002
    Location
    Iowa / Notre Dame
    Posts
    538
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Brilliant, absolutley brilliant. It worked like a charm! One question though, I had searched the w3.org site before posting (though not incredibley rigorously) and I didn't find anything that explained the whole can't be smaller than font size thing. Maybe it is just a common sense or trial-and-error thing, but how did you come across that knowledge? Seeing as I am going to use div's a lot more for the time being, it might be nice to have a reference site (if that is how you found out your info) to look at.

    Thanks a lot!!
    My Site {Mike's Adventures}

    Yikes, forums are almost too much fun.

  • #5
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    If you use "overflow: hidden" you can size the div however you want without worrying about font sizes.

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Location
    Montreal, Canada
    Posts
    644
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Had thought about using overflow, but wasn't sure if older browsers supported it. If so, go ahead use either.

    I found more or less by trial and error. Just playing around with spans and divs.

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Location
    Iowa / Notre Dame
    Posts
    538
    Thanks
    0
    Thanked 0 Times in 0 Posts
    But doesn't overflow cause the user to not be able to scroll the page? Or is that just overflow-x and overflow-y?
    My Site {Mike's Adventures}

    Yikes, forums are almost too much fun.

  • #8
    Regular Coder
    Join Date
    Jun 2002
    Location
    Beyond Lament
    Posts
    424
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yeah, I think 'overflow' is just for showing the scrollbars...

    Quíet Storm Designs ~ Art is not what you see, but what you make others see.
    · the Storms· || ·Ultraviolent Winter· || ·Was Einstein Wrong?· || ·It´s About Time!·

  • #9
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    Originally posted by pardicity3
    But doesn't overflow cause the user to not be able to scroll the page? Or is that just overflow-x and overflow-y?
    Only if applied to the <body> element.


  •  

    Posting Permissions

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