如何在我的情況下在一行中顯示div

Question

「空白」與整個頁面一樣寬。現在我想在文字「返回主題」後添加Google廣告格。我已經嘗試過「float：left」。它運作不好。

<div class="blank"> 
    <p> 
    <a href="#"><&nbsp;Back to the topic</a> 
    </p> 
    this is google ads! 
</div> 

CSS

.blank p{ 
    width:980px; 
    height:25px; 
    margin:80px auto 0px auto; 
} 
.blank p a{ 
    color:#007aff; 
    font-size:20px; 
} 

Answer 1

要浮動，並用容器包裝他們什麼獨立的元素。之後，清除。 JSFIDDLE

<div class="container"> 
    <div class="blank"> 
     <p><a href="#">&laquo; &nbsp;Back to the topic</a></p> 
    </div> 
    <div class="advert"><p>this is google ads!</p></div> 
    <div class="clear"></div> 
</div> 

CSS

div.container { 
    width:980px; 
    height:25px; 
    margin:80px auto 0px auto;} 

.blank { 
    float: left; 
    margin-right: 20px; 
} 

.blank p a{ 
    color:#007aff; 
    font-size:20px; 
} 

.advert {float: left;} 

.clear {clear: both;} 

Answer 2

你可以使用display: inline-block;

HTML

<div class="blank"> 
    <p><a href="#"><&nbsp;Back to the topic</a></p> 
    <div class="google-ad">this is google ads!</div> 
</div> 

CSS：

.blank p{ 
    width:980px; 
    height:25px; 
    margin:80px auto 0px auto; 
    display: inline-block; 
} 
.blank p a{ 
    color:#007aff; 
    font-size:20px; 
} 
.google-ad{ 
    display: inline-block; 
}