HTML - Why doesn't the percentage width child in absolutely positioned parent work in IE 7?

I have an absolutely positioned div containing several children, one of which is a relatively positioned div. When I use a percentage-based width on the child div, it collapses to 0 width on IE7, but not on Firefox or Safari.

If I use pixel width, it works. If the parent is relatively positioned, the percentage width on the child works.

Is there something I'm missing here?

Is there an easy fix for this besides the pixel-based width on the child?

Is there an area of the CSS specification that covers this?

This question and answers originated from www.stackoverflow.com

Question by Kevin Dente (7/31/2008 10:08:08 PM)

Answer

Does the parent div have a defined width either pixel or percentage? Not 100% sure but I think in IE7, the parent div needs a defined width for child percentage divs to work correctly.

Answer by Unknown

Show Additional Answers >>

Find More Answers

Related Topics html css browser css3 internet-explorer-7

Related Questions

Absolutely positioned text does not animate when fading the parent element in IE
I'm having an issue where I'm trying to create a slideshow that fades slides. There is text overlaid on each slide and this text is absolutely positoned so that it sits partially outside the contain…
opacity in ie using absolutely positioned divs not working
I've been banging my head against the wall for a few hours how trying to sort this out. I'm trying to position one div on top of another for the purpose of fading one in on top of the other. The div…
Float mistake in arbitrary-width div positioned absolutely
again a problem with IE browsers version 6 and 7 Take a look at an example right away, try resizing the window and such. http://fiddle.jshell.net/BXfNJ/10/show/ a preview (easier to open in I…
Internet Explorer: relatively positioned button alignment in absolutely positioned box
In IE7, my order sample button "#itmSampl" isn't vertically aligned with the ".add-to-cart" button to the left of it, although in FF3.6 and Chrome 5 it is. I need it to be aligned correctly in IE6-8…
How to force a li item to be 100% of the parent container's width in IE 7?
I'm applying a background color to my list items. But in IE7, my child list items are not being rendered the full width of the parent UL item. Instead, it appears that they act like inline elements …
doesnt work in IE
here is my javasript: function random_imglink() { var myimages = [ {image: "/documents/templates/projedepo/banner/canon.jpg", url: "/index.cfm?fuseaction=objects2.detail_produ…
absolutely positioned DIV not showing on IE
This is the simplified style for a blog hosted at wordpress.com. The code is validated CSS, yet IE won't show it correctly (that are not really news, are they?). In particular, the upper menu (#prim…
Why don't negative margins work in IE 7?
I declared a negative margin on a link, but it doesn't work on IE 7. #search a { color: #E5E5E5; text-decoration: none; font-weight: bold; float:right; margin-top:-20px; // this is not …
Absolutely Positioned Element Error In IE7
I'm having an issue where an absolutely positioned div is hiding behind a floating div. I've done a lot of reading on stack for the answer to this and nothing I've tried works, so I'm going to drop …
Problem with fluid width layout in IE 6 & 7
http://dl.dropbox.com/u/18795563/blog/index.html When resizing the window in IE 6, 7, and 8, This happens: http://img64.imageshack.us/i/aaawz.png/ It's fine when the window is Maximized, But when …