0

画像ロゴに隣接するリンクを作成する方法....同じ行にリンクを作成しようとしています....フロートを左に配置しましたが、機能しません....以下にコードを提供します

http://jsfiddle.net/hYGwH/14/embedded/result/

<li>
                            <a href="/product.html" >
                                <img alt="squareList" style="margin-right: 10px;" id="logo"   src="http://intra.defie.co/images/cube_inventory.png">
                                My Files
                            </a>
                        </li>
                        <li>
                            <a href="/solution.html">
                                <img alt="squareList" style="margin-right: 10px;" id="logo"   src="http://intra.defie.co/images/cube_inventory.png">Shared Files</a>
                            </li>
                        <li>
                            <a href="/service.html"> 
                            <img alt="squareList" style="margin-right: 10px;" id="logo"   src="http://intra.defie.co/images/cube_inventory.png">Create Files</a></li>
                        <li class="iphonePartnerLink">
                            <a href="/partner.html">
                            <img alt="squareList" style="margin-right: 10px;" id="logo"   src="http://intra.defie.co/images/cube_inventory.png">Simply Notes</a></li>
                        <li>
                            <a href="/contact.html"> 
                            <img alt="squareList" style="margin-right: 10px;" id="logo"   src="http://intra.defie.co/images/cube_inventory.png">Forms</a></li>
                        <li>
                            <a href="/contact.html"> 
                            <img alt="squareList" style="margin-right: 10px;" id="logo"   src="http://intra.defie.co/images/cube_inventory.png">Drawing</a></li>
                        <li>
                            <a href="/contact.html"> 
                            <img alt="squareList" style="margin-right: 10px;" id="logo"   src="http://intra.defie.co/images/cube_inventory.png">
                                Presentation</a></li>
4

2 に答える 2

2

水平方向に十分なスペースがない限り、ul はロゴの横に浮かびません。したがって、ウィンドウを小さくしすぎると、ロゴの下に表示されてしまいます。ナビゲーションの a タグのフォント サイズを小さくすると、小さな画面に収まるようになります。

于 2013-03-16T00:53:05.537 に答える
0

画像をアンカーの前に置き、画像を左に浮かせてみてください。また、次の li で float をクリアするか、li で overflow:hidden のような clearfix を使用する必要があります。もちろん、複数 ID の問題も解決します。

于 2013-03-16T00:50:25.720 に答える