при наведении на элемент делаю бордер.но начинается дискотека.
как убрать эти танцы диско?
li:hover {
padding: -2px;
border: 1px solid;
}
Stack Overflow на русском — это сайт вопросов и ответов для программистов. Присоединяйтесь! Регистрация займёт не больше минуты.
Присоединиться к сообществупри наведении на элемент делаю бордер.но начинается дискотека.
как убрать эти танцы диско?
li:hover {
padding: -2px;
border: 1px solid;
}
Граница влияет на размеры блока. Можно в обычном состоянии задавать прозрачную границу, а при наведении просто менять её цвет, либо использовать outline
h5 {
margin: 0;
}
ul {
padding: 0;
list-style-type: none;
}
li {
display: inline-block;
padding: 10px;
border: 2px solid transparent;
}
li:hover {
border-color: red;
}
.without li,
.outline li {
border: none;
}
.without li:hover {
border: 2px solid red;
}
.outline li:hover {
outline: 2px solid red;
}
<h5>C предустановленной границей</h5>
<ul>
<li>asdasdasdasd</li>
<li>asdasdasdasd</li>
<li>asdasdasdasd</li>
</ul>
<h5>Без предустановленной границы</h5>
<ul class="without">
<li>asdasdasdasd</li>
<li>asdasdasdasd</li>
<li>asdasdasdasd</li>
</ul>
<h5> C outline</h5>
<ul class="outline">
<li>asdasdasdasd</li>
<li>asdasdasdasd</li>
<li>asdasdasdasd</li>
</ul>