Border делает отступ для других блоков как исправить?

Question

[Mars Cossado]

При навидении на блок снизу появляеться border-bottom, создавая отступ блокам которые находяться ниже. Все это выглядит не красиво, извините кода нету надеюсь вопрос вы поняли хорошо.

Answer 1

[Владимир Проскурин]

Если контент с фиксированным размером, то box-sizing, но я полагаю, что у вас высота блока зависит от содержимого. В таком случае предлагаю установить блоку прозрачную рамку такого же размера

.block {
    border: 1px solid transparent;
}

и при наведении, просто менять цвет рамки.

.block:hover {
    border-color: red;
}

таким образом, рамка будет всегда, и при наведении лишь будет меняться цвет.

Answer 2

[DanKud]

Добавьте в стиле блока:
box-sizing: border-box;

Comments

[Dymok]

это не поможет, если изначально бордера нет.
нужно в спокойном состоянии делать цвет бордера transparent, а при ховере - нужный.

[DanKud]

Dymok, вы бы хоть проверили для начала, прежде чем утверждать такое - https://codepen.io/anon/pen/bZjEyK

[Владимир Проскурин]

DanKud, смотрите, box-sizing действует, если размеры указаны фиксировано, но при автоматической высоте он не поможет https://codepen.io/anon/pen/MxBeab А так, да, если height: 100px, то при box-sizing: border-box какой-бы border не поставить, высота блока останется 100px.