Добрый день, люди, наткрулся только что на одну интересную особенность, и, так как сам не лучший верстальщик, хочу спросить почему так просиходит?
<html>
<head>
<style type="text/css">
form input[type=text]{
width:100px;
}
.test input{
width:200px;
}
</style>
</head>
<body>
<form>
<input type="text" />
<div class="test"><input type="text" /></div>
</form>
</body>
</html>
Почему оба поля одинаковой ширины? Почему второе правило не срабатывает? Оно ведь должно перекрывать правило на втором инпуте.
И даже если класс переместить на поле, то всеравно оно не будет восприниматься.
UPD: Я не ищу решения проблемы, я хочу узнать почему так происходит!
Такой код тоже работает неожиданно (для меня)
<html>
<head>
<style type="text/css">
form input[type=text]{
width:100px;
}
.test{
width:200px;
}
</style>
</head>
<body>
<form>
<input type="text" />
<div><input type="text" class="test" /></div>
</form>
</body>
</html>
Простой
