Блог

У меня возникла проблема с моим CSS, которая возникает только в IE7, и я надеюсь, что кто-то еще сталкивался с этим раньше. По сути, у нас есть пользовательский дизайн сетки, в котором ячейки подсвечиваются при наведении курсора мыши. Это отлично работает, однако в IE7 выделение сохраняется, вы наводите курсор на ячейку, затем покидаете ячейку, и выделение все еще там.

Вот css, который я использую для ячейки

 .cell input:hover
{
    background-color: #54B5FF;
}
  

Спасибо!

Редактировать:родительский

 .cell input
{
border:none;
background:transparent;
padding:11px 6px;
width:35px;
height:16px;
line-height:16px;
text-align:right;
background-color:transparent;
border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;
 }
  

редактировать: найдено исправление!

Я нашел исправление, которым, как я думал, поделюсь со всеми, кто столкнется с этой ошибкой в будущем. По-видимому, в IE7 только определенные изменения стиля вызывают ситуацию, называемую hasLayout, которая, по-видимому, приводит к правильному повторному отображению. В моем случае я изменил код на

 .cell input:hover
{
position: static;
background-color: #D7ECFF;
}
  

Это ничего не изменило, но заставило IE7 правильно отобразить его!

Установите значение по умолчанию.

Попробуйте:

 .cell input {
    background-color: #fff; /* or whatever you want it to be... */
}

.cell input:hover
{
    background-color: #54B5FF;
}