---
title: "percentage width child in absolutely positioned parent with div not work"  
description: "percentage width child in absolutely positioned parent with div not work"  
author: "Anonymous User"  
published: 2013-02-11  
updated: 2013-02-11  
canonical: https://www.mindstick.com/forum/582/percentage-width-child-in-absolutely-positioned-parent-with-div-not-work  
category: "css-css3"  
tags: ["css-css3"]  
reading_time: 1 minute  

---

# percentage width child in absolutely positioned parent with div not work

Hi Everyone!

I have an absolutely positioned div containing several [children](https://yourviews.mindstick.com/view/81386/mobile-app-based-education-curse-or-boon-for-our-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](https://www.mindstick.com/forum/159398/any-way-to-disable-firefox-4-textarea-resizing-handles-please-help) or Safari.

If I use [pixel](https://www.mindstick.com/interview/33859/how-to-create-pixel-counter-in-javascipt) width, it works. If the [parent](https://www.mindstick.com/blog/154/how-to-find-parent-of-control-in-wpf) is relatively positioned, the percentage width on the child works.

Is there something I'm [missing](https://answers.mindstick.com/qa/52138/international-missing-children-s-day-2019-was-observed-on) here? Is there an easy [fix](https://yourviews.mindstick.com/view/80763/donald-trump-ki-jeet-fix-hai) for this besides the pixel-based width on the child? Is there

an area of the [CSS](https://www.mindstick.com/forum/514/background-gradient-ie7-css-problem) [specification](https://www.mindstick.com/news/369/specifications-of-redmi-note-10-series-leaked-before-the-official-launch) that covers this?

Thanks in [advance](https://www.mindstick.com/blog/33258/jee-mains-and-jee-advance-exams)

## Replies

### Reply by AVADHESH PATEL

Hi Jayprakash!\
You can try this way\
\

```
<html> <head> <style> #div {  position: absolute;  left: 200px; top: 200px;  width: 100%;  height: 80%; background: #LightBlue; }  #child {  width: 80%;  height: 60%;  background: #LightGray; }  #divrel {  position: relative;  left: 25px;  top: 25px;height: 25px; width: 50%;  background: LightGreen; } </style> </head>  <body> <div id="div"> <div id="divrel"></div>  <div id="child"></div>  </div> </body> </html>
```

\
I hope it resolve your problem


---

Original Source: https://www.mindstick.com/forum/582/percentage-width-child-in-absolutely-positioned-parent-with-div-not-work

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
