Problemy z wyświetlaniem postów.

Question

Cześć, pisząc dziś stronę wyświetlającą posty jak na facebooku (na bootstrapie) natknąłem się na problemy.

Pierwszy problem polaga na tym że nie wiem jak mam zrobić to żeby awatary użytkowników były wyśrodkowane na statycznym divie który ma wymiary 80x80 px.

Chcę uzyskać coś takiego:

a narazie wygląda to tak:

Kod:

  <style>
.img-thumbnail{        
    width: 80px !important; 
    height: 80px !important;
    overflow: auto;
}
</style>
<div class="img-thumbnail">
	<img src="src/awatary/2b9f0155e35f80a47dc22fe7cd6eb337.jpg" style="width: 70%; height: 70%%; "   alt="Avatar"  /></div>

Problem drugi: nie wiem dlaczego tekst w wellu mi się nie zawija tylko idzie ostro dalej.

Kod:

<div class="well">
	<div class="row">
	<div class="col-sm-5">
	<b><a href="uzytkownik.php?id=7">Marakas Pawłowski</b></a><br />
	<div class="img-thumbnail">
	<img src="src/awatary/2adec694d06aca5264b13d6064974fbc.jpg" style="width: 70%; height: 70%%; "   alt="Avatar"  /></div>
	<br /><br />
	</div>
	<div class="col-sm-2"></div>
	<div class="col-sm-5 text-right">2016-09-17 o godzinie 15:53</div>
	<br /><br /><br /><br /><br /><br /><br /><br /><div class="col-sm-6"><b>Pisze:</b><br />aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br /><br /></div>
	</div>
	</div>

Całość jest zamknięta w 

<div class="col-sm-7">

<div class="well text-left">

 

Pomożecie? Siedzę nad tym od kilku godzin i nie mam pomysłu jak naprawić te dwa problemy.

Answer 1

Do .img-thumbnail dodaj text-align:center

Do .well dodaj word-wrap:break-word

Comments

Drugie działa (dzięki :D)

A co do pierwszego to chciałbym jeszcze żeby był wyśrodkowany w pionie. Dałoby się to jakoś zrobić?