Каскадная проблема CSS: Mozilla

Question

У меня проблема с просмотром моего веб-приложения в Mozilla.В моем веб-приложении есть кнопка, стили CSS которой имеют следующий вид:

.page_button
{

 BACKGROUND-IMAGE: url(../images/pagebutton_bg2.png); 
 BORDER-LEFT:0px; 
 /*WIDTH: 100%;*/
 CURSOR: pointer; 
 /*COLOR: #000000;*/
 BORDER-BOTTOM:0px; 

}

Как указано выше, я закомментировал атрибуты "Width:100%" & "Color:#000000", так как они вызывают проблемы в Mozilla Firefox (опция width100% делает мои кнопки очень маленькими), поэтому я прокомментировал их.

Но проблема здесь в том, что эта кнопка наследует те же Color:#000000 & Width:100% от других родительских элементов. Как я могуостановите это наследство.

Я даже пытался переопределить эти свойства, такие как: Color : null; Width : none ---> Но это не работает.

Я ценю любые предложения по преодолению этого.

С уважением, Виджай

Answer 1

width - это не наследуемое свойство , поэтому вы должны применить стиль width: 100% к своей кнопке с помощью другого селектора.

Если у вас еще нет Firebug , тогда я рекомендую установить и использовать его.С помощью Firebug вы можете выбрать любой элемент DOM и проследить, как именно были рассчитаны значения всех свойств CSS для элемента.

Answer 2

Если кнопка находится на элементе ссылки, ширина не будет действовать, если ссылка не установлена ​​на display:block; или display:inline-block; , Это может иметь непреднамеренный эффект.

Я также рекомендую Firebug!

Answer 3

Я не знаю, правильно ли я понимаю вашу проблему, но если вы хотите предотвратить случайное наследование, вы можете попробовать использовать полные пути ... поэтому вместо простого .page_button вы можете использовать что-то вроде body.page_button, хотя это больше Вероятно, вы должны сделать это где-то еще в своем коде, а не в той части, которую вы выражаете надежду, которая помогает ... удачи!