IE7 отрезав границу диапазона тега

Question

У меня есть следующий класс в моем стиле CSS лист:

.errormsg { 
    border:solid 1px Red; 
    padding:5px 20px 5px 20px; 
    margin:5px; 
    color:Red; 
    font-size:medium; 
    font-weight:bold; 
} 

Когда я его просмотра в IE7, верхняя и нижняя граница отрезали, когда я использую этот класс на a span тег.

Что нужно добавить, чтобы заставить его работать в IE7?

Answer 1

<pan> элементы будут рассматриваться как встроенные элементы, если вы не укажете иное. Добавьте display: block; в свой CSS и оттуда. Альтернативой было бы использовать <div> для обертывания сообщения об ошибке, поскольку <div> s по умолчанию рассматриваются как элементы блока.

Answer 2

Я заметил подобные проблемы с такими вещами, когда высота линии недостаточно велика. Попробуйте немного увеличить его.

Answer 3

Установка display: inline-block; на <div> исправят проблемы с отображением, а ширина будет по-прежнему адаптироваться к размеру текста: Demo

Вы также мог бы ель его немного с css3text-shadow, box-shadow и gradient с an icon от iconfinder: Demo