html - box-sizing border appear on hover contents moving -


code:

   <div class="block">      </div>  div.block {    box-sizing: border-box; } div.block:hover {    border: 1px solid orange; } 

when hovering block use of box-sizing, contents inside moving, how prevent this?

div.block {    box-sizing: border-box;    border: 1px solid [your bg color];  } div.block:hover {    border: 1px solid orange; } 

try :)

when hover adds border. making pixels. if add border original item(this case block) wont have add new pixels, exsist.

as said below: border 1px solid transperparent wil work fine to


Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -