Как установить кнопку ниже изображения?

Question

У меня есть одна маленькая проблема:

Как я могу установить кнопку ниже изображения?

Это мой CSS код:

.news_img{ 
    margin:0 20 0 20; 
    float:left; 
} 
.trailer_button{ 
    z-index:999; 
    float:left; 
    margin:1 20 -20 20; 
    width:181px; 
    border-radius:10px; 
} 
.buttonimg{ 
    width:auto; 
    height:auto; 
} 

.news_img это изображение
.trailer_button кнопка
-buttonimg является ДИВ кнопки и изображение вокруг

Это HTML

<div class="movie_box"> 
    <h3 class="h3">'.$movies['name'].'</h3>' 
    <div class="buttonimg"> 
     <div class="news_img"> 
      <img src="'.$movies['cover'].'"/> 
     </div> 
     <button class="trailer_button" type="button">Trailer</button> 

Answer 1

Либо <br/> Mor Haviv предложил, или просто удалить поплавки:

Вот бегущий Example Fiddle

.news_img{ 
    margin:0 20 0 20; 

} 
.trailer_button{ 
    z-index:999; 

    margin:1 20 -20 20; 
    width:181px; 
    border-radius:10px; 
} 
.buttonimg{ 
    width:auto; 
    height:auto; 
} 

Answer 2

Это должно ваш HTML-код:

<div class="movie_box"> 
    <h3 class="h3">'.$movies['name'].'</h3>' 
    <div class="buttonimg"> 
     <div class="news_img"> 
      <img src="'.$movies['cover'].'"/> 
      <br/> 
      <button class="trailer_button" type="button">Trailer</button>  
     </div> 
    </div> 
</div> 

Установка кнопки в к DIV изображения, а с помощью
, чтобы создать новую строку, просто под картинкой и поставить там кнопку.

jsFiddle: http://jsfiddle.net/1a0mzqz0/