Я новичок в CSS, так что извините, если этот вопрос просто глупый или слишком простой, но я просто не знаю, как это сделать.
Мне нужно поместить кнопку над изображением, как она должна выглядеть:
Вы видите там синюю кнопку "Копит", это IT! Я улаживаю эту вещь уже на своем веб-сайте, но как одно изображение, поэтому мой код выглядит следующим образом:
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;
}
Мой 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>
Есть ли кто-нибудь, кто может помочь мне стилизовать эту кнопку в качестве другого элемента?
Большое спасибо за чтение этого сообщения.