html - How to add Button over image using CSS? -
i new in css sorry if question stupid or simple dont know how it.
i need place button on image, how should looks:
you see there blue button "kopit" thats it! style thing website 1 single image code looks like:
css:
#shop{ background-image: url("images/shop_bg.png"); background-repeat: repeat-x; height:121px; width: 984px; margin-left: 20px; margin-top: 13px; } #shop .content{ width: 182px; /*328 co je 1/3 - 20margin left*/ height: 121px; line-height: 20px; margin-top: 0px; margin-left: 9px; margin-right:0px; display:inline-block; }
my html:
<div id="shop"> <div class="content"> counter-strike 1.6 steam <a href="#"><img src="images/cssteam.png"></a></div> <div class="content"> counter-strike 1.6 steam <a href="#"><img src="images/cssteam.png"></a></div> <div class="content"> counter-strike 1.6 steam <a href="#"><img src="images/cssteam.png"></a></div> <div class="content"> counter-strike 1.6 steam <a href="#"><img src="images/cssteam.png"></a></div> <div class="content"> counter-strike 1.6 steam <a href="#"><img src="images/cssteam.png"></a></div> </div>
is here can me style button different element?
thanks lot reading post.
if understood correctly, change html this:
<div id="shop"> <div class="content"> <img src="http://placehold.it/182x121"/> <a href="#">counter-strike 1.6 steam</a> </div> </div>
then able use position:absolute
, position:relative
force blue button down.
i have created jsfiddle: http://jsfiddle.net/y9w99/
Comments
Post a Comment