How Can I Set Button Below Image?
I have one little problem: How can I set button below image? This is my css code: .news_img{ margin:0 20 0 20; float:left; } .trailer_button{ z-index:999; float:left;
Solution 1:
This should be your HTML code:
<divclass="movie_box"><h3class="h3">'.$movies['name'].'</h3>'
<divclass="buttonimg"><divclass="news_img"><imgsrc="'.$movies['cover'].'"/><br/><buttonclass="trailer_button"type="button">Trailer</button></div></div></div>
Inserting the button in to the image div, and using to create a new line, just under the picture and put the button there.
jsFiddle:http://jsfiddle.net/1a0mzqz0/
Solution 2:
Either the <br/>
Mor Haviv suggested, or just remove the floats:
Here's a running Example Fiddle
.news_img{
margin:020020;
}
.trailer_button{
z-index:999;
margin:120 -2020;
width:181px;
border-radius:10px;
}
.buttonimg{
width:auto;
height:auto;
}
Post a Comment for "How Can I Set Button Below Image?"