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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Oct 2009
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Scrollable DIV's while defning height in percentages

    Hi.

    I have a div which looks pretty much like this in my CSS:

    Code:
    .myDIVClass {
            height: 50%;
            overflow-y: scroll;
    }
    The div displays records from a database.

    The problem is that when I have too many records to present, IE lets the div "invade" into regions below its border. As you can see, I've used the "overflow-y" property to make IE create a scrollbar, but to no avail.

    Also, when I define "height" in absolute pixels (as opposed to percentages, as in the example), then it works perfectly fine. But as soon as I use percentages, it fails on me and completely ignores the scrolling command.

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Have you given the html and body a height and a width. If you haven't the other commands will not know what their percentages are of.

    body, html{height:100%;
    width:100%;
    }

    Your complete code or better still a link would be useful.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    New to the CF scene
    Join Date
    Oct 2009
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thanks for your solution, however it isn't related to my question.

    Yes, I have indeed given my body and html height and width. Yes, percentages work perfectly fine for me anywhere else. The only problem I have is when I have to have one of my DIV's use a scrollbar.

    Try it yourself: Pick a DIV which uses a y-axis scrollbar in case of overflow, then define its height using percentages instead of pixels.

    Unfortunately, I can't include the entire file - It is in a different network (away from the internet) and I'm not allowed to mix the two.

    Any ideas?


  •  

    Posting Permissions

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