<!-- начало первого блока (про кота) -->
<div class="content">

<!-- начало заголовка первого блока -->
<div class="content-header"><strong>Мой Котэ</strong></div>
<!-- конец заголовка первого блока -->


<!-- начало содержимого первого блока -->
<div class="content-telo">

<!-- объединим катринку и текст в таблицу с двумя ячейками -->

<!-- начало таблицы -->
<table width="100%">
<tr>

<!-- начало левой ячейки (там где картинка) -->
<td width="160px">
<img src="kot.jpeg" />
</td>
<!-- конец левой ячейки -->

<!-- начало правой ячейки (там где текст) -->
<td align="left" valign="top" class="content-text">
Познакомьтесь, это мой Котэ! Бла-бла-бла-бла-бла-бла-бла
-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла
-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла
-бла-бла-бла-бла-бла-бла-бла-бла-бла-бла...
<br />
<div class="podrobnee"><a href="kot.html"><b>подробнее &gt;&gt;&gt;</b></a></div>
</td>
<!-- конец правой ячейки -->

</tr>
</table>
<!-- конец таблицы -->

</div>
<!-- конец содержимого первого блока -->

</div>
<!-- конец первого блока -->


<!-- начало второго блока (про тебя) -->
<div class="content">

<!-- начало заголовка второго блока -->
<div class="content-header"><strong>А это Я!</strong></div>
<!-- конец заголовка первого блока -->


<!-- начало содержимого второго блока -->
<div class="content-telo">

<!-- объединим катринку и текст в таблицу с двумя ячейками -->

<!-- начало таблицы -->
<table width="100%">
<tr>

<!-- начало левой ячейки (там где картинка) -->
<td width="160px">
<img src="ya.jpg" />
</td>
<!-- конец левой ячейки -->

<!-- начало правой ячейки (там где текст) -->
<td align="left" valign="top" class="content-text">
Познакомьтесь, это Я! Покачто я такой, но это ненадолго!
Скоро у меня будет всё! Рестораны, лимузины, шлюхи,
деньги и власть! Ведь я почти уже научился делать сайты!
<br />
<div class="podrobnee"><a href="http://css-standart.ru"><b>подробнее &gt;&gt;&gt;</b></a></div>
</td>
<!-- конец правой ячейки -->

</tr>
</table>
<!-- конец таблицы -->

</div>
<!-- конец содержимого второго блока -->

</div>
<!-- конец второго блока -->

.content{ /* стиль для контента */
border-width:1px; /* толщина рамки */
border-style:dashed; /* стиль рамки (в нашем случае пунктирный) */
border-color:#333333; /* цвет рамки */
background-color:#FFFFFF; /* цвет фона */
margin-bottom:10px; /* внешний отступ снизу */
}

.content-header{ /* стиль для заголовка контента */
height:30px; /* высота блока */
color:#996600; /* цвет текста */
font-size:20px; /* размер шрифта */
padding:0 0 0 15px; /* внутренние отступы (соответственно: сверху справа снизу слева) */
line-height:30px; /* высота строки */
}

.content-header strong{ /* стиль для тега strong в заголовке контента */
font-weight:normal; /* вид шрифта */
}

.content-telo{ /* стиль для содержимого контента */
padding:0 10px 10px 10px; /* внутренние отступы (соответственно: сверху справа снизу слева) */
}

.content-text{ /* стиль для текста в контенте */
color:#333333; /* цвет текста */
line-height:16px; /* высота строки */
font-size:12px; /* размер шрифта */
}

.podrobnee{ /* стиль для ссылки "подробнее >>>" */
text-align:right; /* выравнивание по правой стороне */
}

.podrobnee a{ /* стиль для ссылки "подробнее >>>" */
font-size:12px; /* размер шрифта */
color:#993300; /* цвет ссылки */
}