<a> ...</a> тег превышает ширину эскиза

Question

У меня проблема с моими эскизами, я добавляю тег TEXT в свой миниатюру, и если ТЕКСТ слишком длинный, это приводит к тому, что ТЕКСТ превышает ширину эскизов. ОЖИДАНИЯ:

+----------------------------------+ 
| Loremipsumdolorsitamet,consectetu| 
| er        | 
|         | 
+----------------------------------+ 

РЕАЛЬНОСТЬ:

 col-md-6 
+----------------------------------+ 
| Loremipsumdolorsitamet,consectetuer 
|         | 
|         | 
+----------------------------------+ 

Это мой код:

while() 
{ 
    <div class="col-md-6"> 
     <div class="thumbnail" style="padding-left:10px; padding-top:5px"> 
     <a>Lorem ipsum dolor sit amet, consectetuer</a> 
    </div> 
    </div> 
} 

Answer 1

Взгляните на этот пример: https://jsfiddle.net/ks3r78bu/

HTML:

<div class="img-cont"> 
    <img src="http://placehold.it/350x150" /> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p> 
</div> 

CSS:

.img-cont{ 
    width:350px; 
    height:150px; 
} 
.img-cont p{ 
    margin:0px; 
    padding:5px; 
    position:relative; 
    top:-150px; 
    left:0px; 
}