0

私はこのサイトを持っています。ご覧のとおり、メニュー バーはソーシャル ネットワーク ボタンの下にあります。ソーシャル ネットワーク ボタンのコンテナー div が として設定されdisplay: inline-block、navbar が として設定されているため、両方の要素がheredisplay: inlineのように同じ行にあると予想していましたが、そうではありません..なぜですか?

<header class="tab-content cabecera">
      <a class="logo pull-left" href="/">
        <img src="images/logo1.png" width="250px" alt="ziiweb"/>
      </a>
      <div class="social">
        <div class="fb-like" data-href="http://www.facebook.com/!!!" data-send="false" data-layout="box_count" data-width="450" data-show-faces="false"></div>
        <g:plusone align="middle"></g:plusone>
      </div>
      <nav style="display: inline">
      <ul class="nav nav-pills">
        <li class="active"><a href="#">Inicio</a></li>
        <li><a href="#">Qué ofrecemos</a></li>
        <li><a href="#">Trabajos</a></li>
        <li><a href="#">Contacto</a></li>
      </ul>
      </nav>
    </header>
4

5 に答える 5

0

div を作成し、その中に と の両方.socialを保持navします。display: inline-block;その中で使うまた
使うfloat: left;.social

<div class="outer" style="display: inline-block; width: 700px;">
 <div class="social" style="float: left;">...</div>
 <nav>...</nav>
</div>

別の方法は、アンドレ・ディオンが答えたものです。

于 2013-08-15T12:28:54.883 に答える
0

またはfloat:left;、nav 要素全体を同じ行に配置するために使用することもできます。

于 2013-08-15T12:23:57.113 に答える
0

I.socialは に設定され、display: inline-block;その後も に設定さnavれdisplay: inline-block;ます。

于 2013-08-15T12:29:56.997 に答える