Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

100% width, padding and absolute positioning

I was trying to make a div fill a certain part of the screen, leaving 412px empty both to the left and to the right. Easy, eh?

Now, when I add position:absolute & top:0, the fill disappears. The element inspector shows it's empty - the "paddings" stay, but the width:100% disappears. I've used this code (without the positioning):

<div style="height:73px; padding-left:413px; padding-right:413px;">
  <div style="width:100%; height:73px; background:url(top-fill-small.png);">
  </div>
</div>

So, how can I position it absolutely (I need it animated later), while preserving the padding? I'd love your help very much. Thanks in advance!

like image 901
Dwarf Vader Avatar asked Dec 29 '22 01:12

Dwarf Vader


1 Answers

Perhaps this?

<div style="width:100%; position:absolute; top:0; left:0">
    <div style="height:73px; background:url(top-fill-small.png); margin-left:413px; margin-right:413px"></div>
</div>
like image 79
thirtydot Avatar answered Jan 22 '23 08:01

thirtydot