0

画像とULのナビゲーションバーがあります。ulにテキストを入力して、divの下部に揃えたいのですが、現在は上部にあります。どうすればこれを達成できますか?
http://jsbin.com/otitaf/1/

<nav>
            <div class="logo">
                <img src="img/logo.jpg" id="logo">
            </div>
            <div class="nav">
                <ul>
                    <li class="bottom">
                        <a href="home.html">Luigi's ♨  Pizzeria</a>
                    </li>
                    <li>
                        <a href="menu.html">Menu</a>
                    </li>
                    <li class="bottom">
                        <a href="#">Map</a>
                    </li>
                    <li>
                        <a href="#">About</a>
                    </li>
                    <li>
                        <a href="#">Contact</a>
                    </li>
                    <li>
                        <a href="#">Praises</a>
                    </li>
                </ul>
            </div>
        </nav>

css

.logo{
    width: 30%;
    float: left;
}
.nav{
    float: right;
}
#logo{
    height: 100%;
    margin-left: 25%;
}
.bottom{
    position: relative;
    vertical-align: bottom;
}
4

2 に答える 2

2

あなたの夢を達成するために以下のcssを使用してください

#side-bar{ position:relative; }
#side-bar ul{position: absolute; bottom: 0;}     /*   this will apply to all ul available in side-bar

これを挿入すると、次のように、クラスまたはIDをulに追加して、具体的に選択することもできます。

.sidebar-ul{position: absolute; bottom: 0;}
于 2013-03-01T06:45:35.577 に答える
1

次のように、ulと位置を調整してみてください。

#side-bar section ul {
position: absolute;
bottom: 30px;
}
于 2013-02-28T21:48:27.860 に答える