Стили и браузеры
Тот, кто попробовал работать со стилями, понял, насколько это удобный и мощный инструмент. Однако, у всякого плюса есть и минусы. Минус стилей в том, что разные браузеры относятся к стилям по разному. В принципе, добиться одинакового результата можно почти всегда в разных браузерах, но – нужно поработать.
Вот пример  из личной практики  – в нем наша ссылка (поместим ее в ячейку таблицу в 100 рх) должна выглядеть в прямоугольнике. Цвет прямоугольника вместе с цветом текста должен изменяться под мышкой. 
(Примем во внимание, что заданы  у нас и другие стили для других ссылок)
CODE:<a href="моя страница.htm" class="mn">Пример </a>
<a href="моя страница1.htm" class="mn">Пример1 </a>
 
Чтобы все это правильно отображалось в Опере (7.23) достаточно так
CODE:<style type="text/css">
<!--
a.mn {
	width: 100%;
	font-family: Verdana;
	font-size: 12px;
	color: #000000;
	background-color: #FFFFFF;
	border: 1px solid #99620F;
	text-decoration:none;
	margin: 0px 1px 1px;
	padding-left: 4px;
	}
a.mn:hover {
 color: #FFFFFF;
  background-color: #000000;
}
-->
</style>
 А ИЕ (6.0)  поймет не все. Этому браузеру необходимо еще указать конкретно стиль ссылки 
CODE:<style type="text/css">
<!--
a.mn:link, a.mn:active, a.mn:visited {
	width: 100%;
	font-family: Verdana;
	font-size: 12px;
	color: #000000;
	background-color: #FFFFFF;
	border: 1px solid #99620F;
	text-decoration:none;
	margin: 0px 1px 1px;
	padding-left: 4px;
	}
a.mn:hover {
 color: #FFFFFF;
  background-color: #FFFFFF;
}
-->
</style>
 
Все у нас работает. Но в Нетскейпе (7.0) картинка выглядит страшновато – наш прямоугольник не растягивается на всю ширину ячейки, а только обрисовывает буковки. Для этого браузера нужно указать еще один параметр – «прижмем» нашу ссылку к правому краю
CODE:<style type="text/css">
<!--
a.mn:link, a.mn:active, a.mn:visited {
	width: 100%;
	font-family: Verdana;
	font-size: 12px;
	color: #000000;
	background-color: #FFFFFF;
	border: 1px solid #99620F;
	text-decoration:none;
	margin: 0px 1px 1px;
	padding-left: 4px;
	float: right;
}
a.mn:hover {
 color: #FFFFFF;
  background-color: #000000;
}
-->
</style>
 
Все хорошо, но ІЕ вдруг перестает показывать правую рамку ячейки.
Экспериментируем, оказывается нужно установить вот так:
CODE:margin: 1px 0px 0px;
 
Прошу знающих: дополните (всегда есть чем) и поправьте (если нужно)