0

現在、以下のサイトを制作中です。

http://www.ultimate-punch.com/

シンプルなカテゴリ ホバー ドロップダウン メニュー (緑色のボックス) がありますが、上部と左側の両方のスペースが作成されており、その理由がわかりません。HTML/PHP は次のとおりです。

<div id="main_nav_left">
<ul>
    <li>Categories&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&#x25BC;
        <ul>
        <? while ($incr_categories != $count_categories) { ?>
            <a href="category.php?cat=<? echo $CATEGORIES[$incr_categories][0]; ?>"><li><? echo strtoupper($CATEGORIES[$incr_categories][0]); ?></li></a>

            <? $incr_categories++;
            } ?>
        </ul>
    </li>
</ul>
</div>

CSSは次のとおりです。

#main_nav_left {
    width: 240px;
    color: #fff;
    font-family: Trebuchet MS;
    font-size: 14px;
    text-transform: uppercase;
    float: left;
    letter-spacing: 1px;
}
#main_nav_left li {
    line-height:50px;
}
#main_nav_left ul li {
    display: block;
    list-style-type:none;
    color: #fff;    
    background-color: #59af56;
    cursor: pointer;
    text-indent: 20px;
}
#main_nav_left ul li ul{
    padding: 0px;
    display: none;
    color: #fff;
    text-indent: 20px;
}
#main_nav_left ul li ul li {
    background-color: #7bc979;
    width: 250px;
    font-size: 26px;
    -webkit-transition: all .8s;
    -moz-transition: all .8s;
    transition: all .8s;
}
#main_nav_left li:hover ul {
    display: block;
}
#main_nav_left ul li ul li:hover {
    background-color: #59af56;
    -webkit-transition: all .8s;
    -moz-transition: all .8s;
    transition: all .8s;
}

なぜそれをしているのか理解できません。どんな助けでも大歓迎です！

4

2 に答える 2

0

UL にはデフォルトのマージンがあり、その上にスペースが生じています。左側のスペースがわかりません。スタイルシートのリセットまたは正規化の使用を検討する必要があります。

于 2013-05-01T19:42:31.703 に答える
0

にはulブラウザによってマージンが設定されているため、表示が崩れます。次のルールを適用して、所定の位置に収まるようにすることができます。

.main_nav_left ul { margin: 1px 0 0 0 0; }
于 2013-05-01T19:42:27.027 に答える