It is necessary to do so that the height of the child element is not inherited by the parent. With position: absolute does not work.

enter image description here

  • Give your code for clarity! - HamSter

1 answer 1

You can use position: relative

 ul { list-style: none; margin: 0; padding: 0; } li { color: white; text-align: center; display: block; float: left; width: 25%; padding: 15px; box-sizing: border-box; background-color: #61CDFF; position: relative; } li:hover { top: -10px; padding: 25px 15px; background-color: #4BBDF2; } 
 <ul> <li>ГЛАВНАЯ</li> <li>ПРОГРАММЫ</li> <li>ДРАЙВЕРЫ</li> <li>СТРИМЫ</li> </ul>

  • one
    Who and what, I wonder, put a minus? - humster_spb
  • one
    I'm not, but I guess because of the lack of groundwork)))) - HamSter
  • @HamSter, well, in this very question everything is clear, without any groundwork. type of principle? :) - humster_spb pm
  • Well, yes, I think so) - HamSter
  • I tried it ... - Air