HTML в порядок

[Allarion]

Ребят, нужна помощь в редактировании простого хтмл кода с табличной вёрсткой.

<table style="width: 100%; background: #a3a3a3;" border="0"><tr>
<td><a href="http://fotki.yandex.ru/users/akayuki/"><img src="http://img-fotki.yandex.ru/get/5907/34248199.69/0_5cc95_583ee5ab_XXL.jpg" alt="" width="100%"></a></td>
<td width="150px" style="float: right; padding-top: 30px;"><center><a href="http://blogs.yandex.ru/button/?id=7501666&type=rating"><img src="http://button.blogs.yandex.net/16/66/7501666-rating-white-male.gif" border="0" alt="Рейтинг блогов" width="80" height="15"></a>
<img src="http://button.blogs.yandex.net/16/66/7501666-counter-orange-male.gif" width="95" height="63" border="0" usemap="#visitorMap" alt="Рейтинг блогов" /><map name="visitorMap"><area shape="rect" coords="0,0,95,51" href="http://blogs.yandex.ru/button/?id=7501666&type=counter"/><area shape="rect" coords="0,51,95,63" href="http://blogs.yandex.ru/button/?id=7501666&type=andyou"/></map>
</center>
</td>
</tr></table>

Применён код у меня на странице в топовом посте. Проблема в том, что в ИЕ и Сафари отображение некорректное, Хром корректно отображает через раз , что могло привести к этому? И как это возможно исправить?

Должно всё выглядеть на данный момент вот так.

Edited July 13, 2011 by Allarion

[stars]

Вам просто необходимо обзавестись книжкой html css

<table style="width: 100%; background: #a3a3a3;" border="0">
	<tr>
		<td>
			<a href="http://fotki.yandex.ru/users/akayuki/">
				<img src="http://img-fotki.yandex.ru/get/5907/34248199.69/0_5cc95_583ee5ab_XXL.jpg" border="0" alt="" width="100%">
			</a>
		</td>
		<td width="150" align="center" style="padding-top:30px;">
			<a href="http://blogs.yandex.ru/button/?id=7501666&type=rating">
				<img src="http://button.blogs.yandex.net/16/66/7501666-rating-white-male.gif" border="0" alt="Рейтинг блогов" width="80" height="15">
			</a>
			<img src="http://button.blogs.yandex.net/16/66/7501666-counter-orange-male.gif" width="95" height="63" border="0" usemap="#visitorMap" alt="Рейтинг блогов">
			<map name="visitorMap">
				<area shape="rect" coords="0,0,95,51" href="http://blogs.yandex.ru/button/?id=7501666&type=counter" alt="">
				<area shape="rect" coords="0,51,95,63" href="http://blogs.yandex.ru/button/?id=7501666&type=andyou" alt="">
			</map>
		</td>
	</tr>
</table>

Edited July 13, 2011 by stars

[Allarion]

  On 7/13/2011 at 11:56 AM, stars said:

Вам просто необходимо обзавестись книжкой html css

Поставил на своей странице.

Спасибо за Ваш вариант. Просмотрел предложенный Вами вариант, было сделано 3 изменения. Общая смотрибельность суммарно во всех браузерах стала лучше, однако пока результат ещё выглядит кривовато.

Небольшие комментарии:

Edited July 13, 2011 by Allarion

[stars]

Во первых это не мой код, а ваш, я лишь подправил ошибки. Во вторых у вас на странице по всюду понаставлены <br> что и дало отступы.

Отсюда можно сделать вывод что вам нужно вставлять html код без переносов строк тубишь, вам нужен вот такой код:

<table style="width: 100%; background: #a3a3a3;" border="0"><tr><td><a href="http://fotki.yandex.ru/users/akayuki/"><img src="http://img-fotki.yandex.ru/get/5907/34248199.69/0_5cc95_583ee5ab_XXL.jpg" border="0" alt="" width="100%"></a></td><td width="150" align="center" style="padding-top:30px;"><a href="http://blogs.yandex.ru/button/?id=7501666&type=rating"><img src="http://button.blogs.yandex.net/16/66/7501666-rating-white-male.gif" border="0" alt="Рейтинг блогов" width="80" height="15"></a><img src="http://button.blogs.yandex.net/16/66/7501666-counter-orange-male.gif" width="95" height="63" border="0" usemap="#visitorMap" alt="Рейтинг блогов"><map name="visitorMap"><area shape="rect" coords="0,0,95,51" href="http://blogs.yandex.ru/button/?id=7501666&type=counter" alt=""><area shape="rect" coords="0,51,95,63" href="http://blogs.yandex.ru/button/?id=7501666&type=andyou" alt=""></map></td></tr></table>

[Allarion]

  On 7/13/2011 at 12:40 PM, stars said:

Во первых это не мой код, а ваш, я лишь подправил ошибки. Во вторых у вас на странице по всюду понаставлены <br> что и дало отступы.

Отсюда можно сделать вывод что вам нужно вставлять html код без переносов строк тубишь, вам нужен вот такой код:

Я и не писал, что это был Ваш код. Да, совсем забыл, что я.ру не воспринимает <br> и любой пропуск строки считает за <br>. Поставив код без пропусков, вновь возникли проблемы в ИЕ

[stars]

Ну как минимум у вас не получилось скопировать правильно у вас там лишние пробелы и разрывы из за этого ie и не показывает правильно... Тут уж я бессилен...

[Allarion]

  On 7/13/2011 at 3:29 PM, stars said:

Ну как минимум у вас не получилось скопировать правильно у вас там лишние пробелы и разрывы из за этого ie и не показывает правильно... Тут уж я бессилен...

Все лишние пробелы были устранены... однако это не решило проблему

[stars]

пробелы по прежнему присутствуют у вас на страницы... хотя бы в адресе картинки.