CSS - текст перемещается при наведении - PullRequest
6 голосов
/ 13 декабря 2011

Я занимаюсь этим уже около часа, и, кажется, не могу его схватить.
Каждый раз, когда я наводю указатель мыши на этот текст (я хочу поместить цвет фона для него, чтобы парить), текст перемещаетсявместе с bgcolor.Вот что я получил:

        #innerheader ul {
            list-style:none;
            margin:0;
            padding:0;
        }
        #innerheader li {
            display:block;
            float:left;
            height:25px;
            margin:0 2px;
            padding:15px 10px 0 10px;
            color:#FFFFFF;
            font-weight:bold;
            font-size:10px;
            text-transform:uppercase;
        }

        #innerheader li a, 
        #innerheader li a:link, 
        #innerheader li a:visited, 
        #innerheader li a:active {
            color:#FFFFFF;
            text-decoration:none;
        }
        #innerheader li a:hover {
            background-color: blue;
            padding: 10px 10px 10px 10px
        }

Ответы [ 5 ]

11 голосов
/ 13 декабря 2011

Удалите отступы в объявлении наведения.Или просто переместите отступ к якору до состояния наведения, как показано в приведенном ниже коде.

Причина, по которой текст перемещается, заключается в том, что на якоре нет заполнения, а затем при наведении курсора - заполнение.

#innerheader li a, 
    #innerheader li a:link, 
    #innerheader li a:visited, 
    #innerheader li a:active {
        color:#FFFFFF;
        text-decoration:none;
        padding: 10px;
    }
    #innerheader li a:hover {
        background-color: blue;
    }
1 голос
/ 13 декабря 2011

Это из-за заполнения. Удалите его, тогда он будет работать нормально.

0 голосов
/ 13 декабря 2011

Вы помещаете отступы на ливер: hover!Конечно, это сместит текст.Чтобы это исправить, вам нужно определить ширину и высоту и уменьшить их на величину заполнения при наведении.ИЛИ переместите отступ в состояние без наведения.

0 голосов
/ 13 декабря 2011

Он движется, потому что вы меняете отступ в блоке наведения. Удалите это, и это должно быть хорошо.

0 голосов
/ 13 декабря 2011

Избавьтесь от набивки, вот что заставляет его двигаться.

...