Код:
<!--HTML--> <table><tr> <td><div class="box"> <div class="image-box"><img src="https://forumavatars.ru/img/avatars/0017/79/f2/64-1464872645.png"></div> <div class="block"><div class="blockin"><h22>Имя</h22></div></div> <div class="details"><div class="info">В нас есть что-то общее, и эти черты явно не наши добродетели. Пусть ты младше меня, но я знаю, что всецело могу доверять тебе, и, конечно же, я приду на помощь в любой момент, тебе стоит только намекнуть. Мои поступки и шутки бывают неприятными, но твоя реакция, твое постоянное спокойствие дают мне повод усомниться в своих истинных мотивах и целях.</div><p>кем приходится</p></div> </div></td> <td><div class="box"> <div class="image-box"><img src="https://forumavatars.ru/img/avatars/0017/79/f2/64-1464872645.png"></div> <div class="block"><div class="blockin"><h22>Имя</h22></div></div> <div class="details"><div class="info"></div><p>кем приходится</p></div> </div></td> </tr></table>
Код:
<!--HTML-->
<style>
td {vertical-align: top;}
.box {margin: 0 auto 0; padding: 10px 0 10px;; text-align: center;}
.image-box {display: inline-block; height: auto; border: 2px solid rgb(123, 79, 42); box-shadow: 0px 0px 1px 2px rgb(45, 22, 5);}
.image-box img {max-width: 150px;}
.block {background-color: #2B0B03; margin-left: 45px; width: 250px; padding: 1px; margin-top: -2px;}
.blockin {background-color: #2B0B03; border: 1px #9B907F solid; margin: 6px; padding: 2px 0px;}
h22 {font-family: 'Georgia'; font-size: 20px; text-transform: uppercase; color: #b99471; text-shadow: 1px 1px 2px #000;}
.details {background-color: rgba(43, 11, 3, 0.45);; width: 240px; margin-left: 50px; border: 1px solid #000; border-top: none;}
.details p {font-family: 'Georgia'; font-size: 13px; font-variant: small-caps; color: #fff; text-shadow: 1px 1px 2px #000;}
.info {background: #fff; color: #000; font-size: 10px; line-height: 10px!important; width: 196px; padding: 2px 2px 5px; margin: 0 20px 0; max-height: 120px; overflow-x: auto;}
</style>