enter image description here

enter image description here

In general, it is necessary that in the header, when hovering over links, a gray background appears in the background (as if a button stood out), I played CSS :hover , increased indents, but the background increased (the servo square increased) but the text began to shift when hovering .....

    1 answer 1

    You need to hover on #top-menu a , while giving it the necessary padding for highlighting. The size #top-menu li must be reduced by the size of the padding so that the overall size of nav does not change.

    UPDATE

    Well, or ask

     #top-menu a { padding: 20px; margin: 0; } 
    • # top-menu a: hover {padding-left: 20; } did not work ... and the .cactus-main-header doesn’t change anything - Oleksii
    • But what a fairy tale - I checked in the inspector. padding should be placed on a itself, without hover. Rosno and it is written in my answer. - KAGG Design
    • # top-menu a {padding: 20; } # top-menu li {padding: 20; } It did not work = ((( - Oleksii
    • yes you do it again. added the answer - KAGG Design
    • thanks, # top-menu a {padding: 20px; } it worked here only the underscore swam away - Oleksii