Кнопка CSS не стиль

Question

Должно быть, мне что-то не хватает, но может кто-то объяснить, что я делаю неправильно с моим CSS? Я бы хотел, чтобы все кнопки имели определенный формат, за исключением нескольких. Я ожидал использовать CssClass, чтобы переопределить некоторые из них, которые должны быть разными, но все они, похоже, используют стандартный.

Мой CSS:

.btn 
{  
    border:none; 
    background-color:red;   
}  

input[type="submit"] 
{ 
    border: 2px solid black; 
    background-color:green;   
} 

Все кнопки занимают второе значение (зеленый фон с рамкой). Тем не менее, у меня есть эта кнопка:

<asp:Button ID="btnAdd" CssClass="btn" runat="server" Text="Add" /> 

Я ожидал этого, не имеет границ, и красный фон, но это так же, как и любую другую кнопка.

Любые идеи, что я делаю неправильно? Thanks

Answer 1

type='button' правила, вероятно, побеждает btn правила в специфичности. Вы можете использовать !important, но это не сработает в IE < 8 и обязательно даст проблемы в долгосрочной перспективе.

Попробуйте это первая:

input[type="submit"].btn 
    { 

     border:none; 
     background-color:red; 

    } 

Answer 2

Место .btn ниже вас input[type="submit"] правило. Если это еще не работает, важно!

.btn 
{  
    border:none !important; 
    background-color:red !important;  
} 

Смотрите здесь для CSS старшинства: http://www.w3.org/TR/CSS2/cascade.html

Answer 3

Стоит также отметить, что селекторы атрибутов, таких как input[type="submit"] не будет работать в IE, они делают в FF, хотя.