2013-02-12 43 views
1

我想讓我的所有div標記在我的標題中水平對齊.... 但現在它們都是垂直對齊的... 如何使其水平對齊。 ...標題中的div標記的水平對齊

提供以下

http://jsfiddle.net/TdcRJ/4/enter image description here

<div class="navbar-inner"> 
     <div class="container-header"> 
      <!-- <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </a> --> 
      <!-- <div class="clear"></div> --> 

      <div class="companyLogo" style="width: 1009px;"> 
       <div style=" 
    display: inline-block; 
"> 
        <a class="brand" href="&lt;?= HOME_URL ;?&gt;" style=""> 
        Company LOGO 
        </a> 
       </div> 
       <div style="clear: left;"> 
        <p>47657 Lakeview Blvd</p> 
        <p>Fremont CA 94538</p> 
        <p>510-657-8981</p> 
       </div> 

       <div> 
        <p>welcome xyz! [email protected]</p> 
       </div> 

       <div class="inline" style="padding-top: 12px;"> 

         <ul class="homePageLists" style=""> 
          <li style="padding-bottom: 5px; list-style: none; color: #333;"> 
           <a style="color: #333;" href="http://www.w3schools.com/" target="_blank"> 
            <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_menu.png"> 
            Menu 
           </a> 
          </li> 
          <li style="padding-bottom: 5px; list-style: none; color: #; "> 
           <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank"> 
            <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png"> 
            Inventory 
           </a> 
          </li> 
          <li style="padding-bottom: 5px; list-style: none; color: #653921; "> 
           <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank"> 
            <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png"> 
            BOM List 
           </a> 
          </li> 
          <li style="padding-bottom: 5px; list-style: none; color: #653921; "> 
           <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank"> 
            <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png"> 
            Sub BOM List 
           </a> 
          </li> 
          <li style="padding-bottom: 5px; list-style: none; color: #9e1c20; "> 
           <a style="color: #9e1c20;" href="http://www.w3schools.com/" target="_blank"> 
            <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_product.png"> 
            Product 
           </a> 
          </li> 
          <li style="padding-bottom: 5px; list-style: none; color: #ff5100; "> 
           <a style="color: #ff5100;" href="http://www.w3schools.com/" target="_blank"> 
            <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_customer.png"> 
            Customer List 
           </a> 
          </li> 
          <li style="padding-bottom: 5px; list-style: none; color: #184179;"> 
           <a style="color: #ff5100;" href="http://www.w3schools.com/" target="_blank"> 
            <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_vender.png"> 
            Vendor List 
           </a> 
          </li> 
         </ul> 

       </div><!--/.nav-collapse --> 

       <div> 
        <p>ABC Systems</p> 
        <p>1234 lakeview Blvd</p> 
        <p>CA 94538</p> 
        <p>510-657-8981</p> 
       </div> 


      </div> 




      <div class="login-container"> 





       <form method="post" action="/Account" class="bs-docs-example form-horizontal" id="createUserForm"> 
        <div class="login-box"> 
         <div class="login-label">Email</div><div class="login-input"><input type="text" name="email" value=""></div> 
        </div> 
        <div class="login-box"> 
         <div class="login-label">Password</div><div class="login-input"><input type="password" name="password" value=""></div> 
        </div> 
        <div class="login-button"> 
        <input type="submit" value="Submit"> 
        </div> 
        <div class="clear"></div> 
       </form> 

         </div>   <div class="clear"></div> 

     </div> 
    </div> 

回答

0

我的小提琴,您可以使用CSS樣式float:left;在你想horizo​​ntall所有div對齊。

+0

我在小提琴更新,但它不工作http://jsfiddle.net/TdcRJ/6/ – user2045025 2013-02-12 03:57:38

+0

試試這個。 http://jsfiddle.net/TdcRJ/11/ 你的代碼不是很乾淨,所以閱讀起來有點困難。 – 2013-02-13 02:34:11

0

你可以把浮動:左或浮動:就在所有div