У меня есть <a>
элементы в двух разных контекстах на моей странице, некоторые в div (назовите их .container> a), а некоторые в дочерних div (например .container> .section> a) и даже некоторые, которые являютсяв дальнейших потомках (например .container> ...> .section> a).В настоящее время я выполняю некоторое форматирование для встроенных <a>
элементов со следующим CSS:
line-height:1.4;
position: relative;
left: 15px;
margin-left: -5px;
Поскольку в настоящее время я оформляю ссылки с помощью border-bottom: 1px dotted #333
, необходимо, чтобы ссылки оставались встроенными элементами.Проблема в том, что иногда ссылки в .section ведут себя не так, как в .container.Последние отлично смотрятся как в FF 3.6, так и в IE7.У первых первый символ или около того (что лежит внутри суммы отрицательного поля) обрезается в IE7 (я полагаю, отрицательным значением поля).
Я думаю, что это может быть ошибкой в hasLayout, поэтому я проверил состояние трех дел.Они заключаются в следующем:
Случай 1) Для .container> a, .container hasLayout имеет значение true.(http://imgur.com/WJ3zM.png)
Случай 2) Для .container> .section> a, .section hasLayout имеет значение false, а .container hasLayout имеет значение true.(http://imgur.com/4NHxj.png)
Случай 3) Для .container> ...> .section> a, .section hasLayout имеет значение false, все, кроме одного из промежуточных контейнеров (div, li и ul), hasLayout имеет значение true, и.Контейнер hasLayout имеет значение true.(http://imgur.com/WefBk.png)
Первые два случая выглядят хорошо в IE7, а в третьем случае есть ошибка с отрицательным запасом. Что может быть причиной этого в столь ограниченном контексте?