5

li 要素に下の境界線を追加しようとしています。これは私のcssです：

.menu{
    text-align:right;
}
.menu li{
    padding:5px;
    text-transform: uppercase;
    display:inline; 
    list-style-type:none;
    list-style-position: inside;

    border-bottom: 1px solid red;
}

そして私のHTML：

    <div class="menu">
        <ul>
            <li>Home</li>
            <li>Home</li> 
            <li>Home</li> 
            <li>Home</li> 
            <li>Testimonials</li>
            <li>About Us</li>
            <li>Contact Us</li>
        </ul>
    </div>

何らかの理由で、下の境界線が追加されません。左右に枠線を追加できますが、下には追加できません。私は何を間違っていますか？

4

2 に答える 2

5

追加してみてください。

html, body{
  margin: 0;
  padding: 0;
}

あなたのコードは、ここでは何も変更せずに正常に動作しています。

于 2012-09-10T16:08:19.080 に答える
-6

あなたの必要性をはっきりと理解しています。解決策を以下に示します。下を右に変更するだけです。テストしてフィードバックをお寄せください。

.menu li{    
    padding:5px;
    text-transform: uppercase;
    display:inline;
    list-style-type:none;
    list-style-position: inside;
    border-right: 1px solid red;
}
于 2012-09-10T16:38:38.270 に答える