html - div background smaller than its content with css (without specifying the width in % or px) -
this have:
<div style="width: 100%; background: red; text-align: center"> <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e5/plain-m%26ms-pile.jpg/280px-plain-m%26ms-pile.jpg" height="170" width="170" style="border-radius:700px; border: 10px solid white;"> </div>
though want: http://i.stack.imgur.com/fstkg.png
i've tried borders, inset shadow, , many other options in css none of them seems work purpose :( there way make div's background smaller contents without having specify height?
adding div it;
<div style="width: 100%; text-align: center"> <div style="width:100%;height:100px;position:absolute;left:0;top:45px;background:red;z-index:-1;"></div> <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e5/plain-m%26ms-pile.jpg/280px-plain-m%26ms-pile.jpg" height="170" width="170" style="border-radius:700px; border: 10px solid white;"> </div>
Comments
Post a Comment