Это образ, который у меня есть:Как использовать вложенные теги p в блоках CSS и Bootstrap?
Я не уверен, как это сделать сделать текст Лью, Сухи Prix, CHF 2'250 быть выравнивать как в изображении. И поскольку я новичок в бутстрапе, я хочу знать, правильно ли я сделал.
.boxes-images img {
width: 100%;
}
.boxes-images h4 {
text-align: center;
background-color: #8C1211;
color: #FFFFFF;
padding: 10px 0px 10px 0px;
font-weight: bold;
margin-top: 0px;
margin-bottom: 0px;
}
.boxes-images .details {
background-color: #D6D6D6;
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
}
<div class="text-page">
<div class="row">
<div class="col-sm-3 boxes-images">
<img src="images/automobile.jpg">
<h4>IMMOBILIER</h4>
<div class="details">
<p>Magnifique et spacieux 4,5 pieces: 1mios de loyer</p>
<p>Lieu<span>suchy</span>
<p>
<p>Prix<span>CHF 2'250</span>
</p>
</div>
</div>
<div class="col-sm-3 boxes-images">
<img src="images/automobile.jpg">
<h4>IMMOBILIER</h4>
<div class="details">
<p>Magnifique et spacieux 4,5 pieces: 1mios de loyer</p>
<p>Lieu<span>suchy</span>
<p>
<p>Prix<span>CHF 2'250</span>
</p>
</div>
</div>
<div class="col-sm-3 boxes-images">
<img src="images/automobile.jpg">
<h4>IMMOBILIER</h4>
<div class="details">
<p>Magnifique et spacieux 4,5 pieces: 1mios de loyer</p>
<p>Lieu<span>suchy</span>
<p>
<p>Prix<span>CHF 2'250</span>
</p>
</div>
</div>
<div class="col-sm-3 boxes-images">
<img src="images/automobile.jpg">
<h4>IMMOBILIER</h4>
<div class="details">
<p>Magnifique et spacieux 4,5 pieces: 1mios de loyer</p>
<p>Lieu<span>suchy</span>
<p>
<p>Prix<span>CHF 2'250</span>
</p>
</div>
</div>
<div class="col-sm-3 boxes-images">
<img src="images/automobile.jpg">
<h4>IMMOBILIER</h4>
<div class="details">
<p>Magnifique et spacieux 4,5 pieces: 1mios de loyer</p>
<p>Lieu<span>suchy</span>
<p>
<p>Prix<span>CHF 2'250</span>
</p>
</div>
</div>
<div class="col-sm-3 boxes-images">
<img src="images/automobile.jpg">
<h4>IMMOBILIER</h4>
<div class="details">
<p>Magnifique et spacieux 4,5 pieces: 1mios de loyer</p>
<p>Lieu<span>suchy</span>
<p>
<p>Prix<span>CHF 2'250</span>
</p>
</div>
</div>
<div class="col-sm-3 boxes-images">
<img src="images/automobile.jpg">
<h4>IMMOBILIER</h4>
<div class="details">
<p>Magnifique et spacieux 4,5 pieces: 1mios de loyer</p>
<p>Lieu<span>suchy</span>
<p>
<p>Prix<span>CHF 2'250</span>
</p>
</div>
</div>
<div class="col-sm-3 boxes-images">
<img src="images/automobile.jpg">
<h4>IMMOBILIER</h4>
<div class="details">
<p>Magnifique et spacieux 4,5 pieces: 1mios de loyer</p>
<p>Lieu<span>suchy</span>
<p>
<p>Prix<span>CHF 2'250</span>
</p>
</div>
</div>
</div>
</div>
У вас не может быть вложенных 'p' тегов – Pete