текстовое оформление не работает на элементе кнопки в Firefox, обходной путь?

Question

У меня есть простая кнопка с одним стилем CSS, например:

<button style="text-decoration:underline">That's a button</button>

Firebug говорит мне на вкладке вычисляемых стилей, что текстовое оформление действительно подчеркнуто.Однако Button-текст не подчеркивается, почему бы и нет?Очевидно, это проблема Firefox (3.6), поскольку Chrome и IE подчеркивают текст кнопки.Есть ли обходной путь css для Firefox, или мне нужно поместить кнопку во внешний div со стилем оформления текста?

Answer 1

Немного больше исследований в сети привело к более элегантному обходному пути, и убедило меня, что это, вероятно, «ошибка». Это почти тип hasLayout для FireFox (не совсем, но действует аналогично). Если вы добавляете любое из следующего, оно показывает подчеркивание: position: absolute, display: block, display: inline-block, float: left (или справа). Итак:

<button style="text-decoration:underline; display: inline-block;">That's a button</button>

Answer 2

Похоже, что это «ошибка» (на самом деле я не знаю, что говорят веб-стандарты об элементе button, поэтому я не решаюсь объявить его «ошибкой» или просто различием в интерпретациях браузера). Это сработало, но на самом деле мало чем отличается от вашего div решения-оболочки:

<button ><span style="text-decoration:underline">That's a button</span></button>