Everybody! This is important. In a few days, these forums will be moving over to using the totally sweet Discourse platform. To ensure this migration happens smoothly with no loss of content, these forums are currently in a read-only mode. I do apologize for the inconvenience.

There is never a good time to turn the forums off for an extended period of time, but I promise the new forums will be a billion times better. I'm pretty sure of it.

See you all on the other side in a few days, and if you have any (non-technical) questions, please e-mail me at kirupa@kirupa.com. For technical questions, try to find a tutorial that corresponds to what you are looking for and post in the comments section of that page.


Results 1 to 10 of 10

Thread: How to position from bottom in IE?

  1. #1
    Registered User

    How to position from bottom in IE?

    I have a site where I need to position a div (nested inside another div) at the very bottom of its parent div. In Firefox and Safari it works fine with the following;
    <div id="leftmenu">
          <div id="language">
              <li><a href="#">item 1</a></li>
              <li><a href="#">item 2</a></li>
              <li><a href="#">item 3</a></li>
    and this css:
    #language {
    	width: 180px;
    	margin: 0;
    	padding: 0;
    	position: absolute;
    	bottom: 0;
    But this doesn't seem to work with IE for Mac. The "language" div simply disappears. Maybe because IE positions it below the bottom?
    I am simply not sure how I should calculate bottom positioning. Also I haven't checked this on PCs yet.
    Can somebody advice me?

  2. #2
    you have to set the positioning on the parent div to relateive so what ever is inside it will be positioned absolute and you have to specify LEFT or RIGHT not just BOTTOM alone.


  3. #3
    Registered User
    OK, the parent div is relative but it doesn't change anything when I define left: 0;.
    What I wonder is; how does the browser place according to bottom? If I position something, left: 0; it is really simple to understand. The top left corner will be placed at 0.
    But if I have bottom: 0;, does the browser place the "lowest" part of the div 0px from the bottom (like it seems in Safari and Firefox). Or does it place the top, left corner 0px from the bottom. Or some other way?

  4. #4
    here is an example of what i think you want but i dunno, maybe it might help you


    ps:just change the exstention on the file to .html
    Attached Files Attached Files

  5. #5
    Registered User
    OK, I hadn't defined the parent div as relative as in your code. Only now the child div shows but not at the right place... it shows up much too high up. Will have a look at this again. THanks! that put me on track at least.

  6. #6
    Registered User
    Hm, I can't really define the height of the parent div (different in each page) and right now the child div shows up way too high... and also often on top of the <li>'s in the parent div.
    Do I have to define the height or is it something else I am doing wrong?

  7. #7
    no you dont have to i just did it for the example

    just as long as you have enough content to make it expand.

    and if you dont have enough content you can do this ive had past experiences like you might be having so i had find a workaround here goes

    add and ID to the body tag for example, 2 pages with each different heights:

    <body id="homepage">
    <body id="contactpage">

    now in css specify the height for each page since they are going to be diffrent heights.

    body#homepage div#content{
    body#contactpage div#content{

    might help ya
    Last edited by aldomatic; July 26th, 2006 at 05:47 PM.

  8. #8
    Registered User
    Yeah, 5 already have body id's but 5 also have content in the parent div, which the child div doesn't seem to care much about!
    Thanks, will look into it more tomorrow

  9. #9

  10. #10
    Uh.. For your information... IE6 does not support CSS "bottom" values. It completely ignores it. You can have left, top, right values, just not bottom.

    You can use height / margin to imitate the effect...
    If you notice this notice you will notice that this notice is not worth noticing.

    "Are you doing anything tonight? If not, how about me?"

    Opera Sucks! - FIX IT
    Oliver Zheng

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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

Home About kirupa.com Meet the Moderators Advertise

 Link to Us


Copyright 1999 - 2012