如何將一個div放在另一個具有浮點的div下：right

我有一個float:right（我不能改變，因爲它是我所有WP頁面的默認值）的菜單div。如何將一個div放在另一個具有浮點的div下：right

我想添加一個div，將堅持在菜單div下的權利。

我做了一點點的油漆工作，向您展示： enter image description here

的黑色部分是一個div。
右上方的導航菜單。
黃色div是我試圖去的部分。

我嘗試使用absolute定位它，但它是一種問題，因爲頁面必須響應。

我嘗試使用vertically-align，它與定位div一起工作，但是當我給黃色div width:50%時，它將菜單推到頁面中間，就好像它佔據了它的位置。

如何將黃色div與文本放置在一起？

這是我必須建立： enter image description here

的jsfiddle：http://jsfiddle.net/z933zvev/3/

HTML：

<div class="careers"> 

    <div class="top"> 
     <ul> <!-- First Menu --> 
      <li> <a href="#"> Clients </a> </li> 
      <li> <a href="#"> About Us </a> </li> 
      <li> <a href="#"> Contact </a> </li> 
      <li class="hasImage"> <a href="#"> <img src="<?php echo $themedir;?>/images/yellow_logo_top_menu_yellow.png" class="logo"> </a> </li> 
     </ul> <!-- End First Menu --> 

     <div class="top-texts"> 
      <div><h1 class="text-yellow">texttexttexttexttexttext.</h1></div> 
      <div><h2>Together.</h2></div> 
      <div> 
       <a href="#"> 
        <img src="<?php echo $themedir;?>/images/open positions.png" /> 
       </a> 
      </div> 
     </div> 

     <div class="texts"> 

     </div> 




    </div> 

</div> <!-- END main -->

來源

2015-02-11 Rick Sanchez

使用CSS clear屬性，用你的紅色&黃色例如：

.red { 
    float:right; color:red; border: solid 5px; padding: 5px; 
} 
.yellow { 
    float:right; color:yellow; border: solid 5px; padding: 5px; 
    clear:right; /* use clear property */ 
}

演示：

http://jsfiddle.net/z933zvev/2/

來源

2015-02-11 14:37:33 Ties

首先，你的HTML是在你的提琴打破。它看起來在你的帖子中是正確的。你所要做的就是將你的頂級文本div浮動並設置爲清晰：這樣它就可以浮動在自己的行上。

.top-texts { 
clear: both; 
float:right; 
}

小提琴 here

來源

2015-02-11 14:43:08

這是clear:right和實際代碼做這件事的方式。

就在這個類添加到您的CSS

.top-texts{ 
    text-align: right; 
    clear: right; 
    margin-right: 35px; 
}

DEMO

希望它能幫助。

來源

2015-02-11 14:48:11

如何將一個div放在另一個具有浮點的div下：right

回答

相關問題