0

絶対位置の div に順序付けられていないリストがあります。個々の li 要素にホバー効果を付けようとしていますが、うまくいきません。カーソルは、li のテキストのかなり上にある場合にのみ、ホバー効果をトリガーします。

これはレスポンシブ デザイン レイアウトの最も広いセグメントであり、ホバーは最も広い状態になるまで問題なく動作します。設計上の懸念から、含まれる div を絶対位置に切り替える必要があり、多くの実験を実行しましたが、常に絶対配置なしで動作しますが、私はコンテナをフローから削除すると、コンテナを最終状態に適切に配置できません。

これは私を夢中にさせています、どこが間違っているのですか??

.secondary_header{
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
    position:absolute;
    width:700px;
    border-bottom-right-radius:60px;
    height:60px;
}   

.secondary_header ul{
    margin:0 auto;
    width:100%;
}

.secondary_header ul li{
    background-image:url(../images/audio_icon.png);
    background-repeat:no-repeat;
    background-position:0px;
    padding-left:50px;
    float:left;
    list-style:none;
    line-height:60px;
    padding-left:50px;
    height:60px;

}

.secondary_header ul li:hover{
   color:#09F;
}
4

1 に答える 1

0

あなたが提供した情報は十分ではありません。次のコードが要件を満たしている場合は、満足するか、要件を詳しく説明して、良いアイデアを得ることができます。

.secondary_header{
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
    position:absolute;
    width:700px;
    border-bottom-right-radius:60px;
    height:60px;
}   

.secondary_header ul{
    margin:0;
    padding:0px;
    width:100%;
}

.secondary_header ul li{
    background-image:url(../images/audio_icon.png);
    background-repeat:no-repeat;
    background-position:0px;
    padding:0 15px;
    float:left;
    list-style:none;
    line-height:60px;
    height:60px;
    cursor:pointer;

}

.secondary_header ul li:hover{
   color:#09F;
}
于 2013-09-28T07:19:42.247 に答える