CODEWITHSUNDEEP
css
ShameOnU
ShameOnU

Reputation: 49

Why CSS position absolute image doesn't show up?

My main container has position relative, and I want to overlay 2 images on each other.

When I add position absolute to one of my div's, it just disappears.

I try to use positioning top left right etc. I attached image how it suppose to look.

How it suppose to look

And here is my code

  <div style="position: relative;">
    <div style="background: url('http://i.imgsafe.org/8797eaa.png') no-repeat; background-size: 100% auto; height: 709px;margin-top: 70px"></div>
    <div style="background: url('http://i.imgsafe.org/8ab6260.png') no-repeat; background-size: 100% auto; height: 170px;position: absolute; top:0; left: 0"></div>
  </div>

Any suggestions?

Upvotes: 4

Views: 4353

Answers (2)

sticksu
sticksu

Reputation: 3738

You forgot so specify the width for your absolute div. Add width: 100% in css.

Upvotes: 2

danish farhaj
danish farhaj

Reputation: 1354

Use 

width:100%

for the image having position absolute will absolutely solve your problem ;)

here is fiddle free for you ^^

http://jsfiddle.net/sxbo705L/1/

Upvotes: 2

Related Questions