[html] Set a Fixed div to 100% width of the parent container

I have a wrapper with some padding, I then have a floating relative div with a percentage width (40%).

Inside the floating relative div I have a fixed div which I would like the same size as its parent. I understand that a fixed div is removed from the flow of the document and as such is ignoring the padding of the wrapper.


<div id="wrapper">
  <div id="wrap">
    Some relative item placed item
    <div id="fixed"></div>


body { 
  height: 20000px 
#wrapper {
  padding: 10%;
#wrap { 
  float: left;
  position: relative;
  width: 40%; 
  background: #ccc; 
#fixed { 
  position: fixed;
  width: inherit;
  padding: 0px;
  height: 10px;
  background-color: #333;

Here is the obligatory fiddle: http://jsfiddle.net/C93mk/489/

Does anyone know of a way to accomplish this?

I have amended the fiddle to show more detail on what I am trying to accomplish, sorry for the confusion: http://jsfiddle.net/EVYRE/4/

This question is related to html css

The answer is

You can use margin for .wrap container instead of padding for .wrapper:

body{ height:20000px }
#wrapper { padding: 0%; }
    float: left;
    position: relative;
    margin: 10%;
    width: 40%; 


Similar questions with html tag:

Similar questions with css tag: