CSS - 如何顯示一對DIV的內聯，在全寬div內？

Question

我有一些HTML，通過Drupal和瀏覽幻燈片生成，即（通常）是這樣的：

<div id="banner"> 
    <div id="image1" class="hidden"> Image .. </div> 
    <div id="text1" class="hidden"> Text .. </div> 
    <div id="image2" class="active"> Image .. </div> 
    <div id="text2" class="active"> Text .. </div> 
</div> 
<div id="counter"> 
    <div class="item1 hidden">1</div> 
    <div class="item2 active">2</div> 
</div> 
</div> 

#banner（圖像和文本）的含量週期性旋轉，#counter的內容顯示項目符號圖像標識活動圖像，通過依次向每個#counter子項添加和移除CSS來選擇該圖像。輸出與http://www.slidesjs.com/有點相似，只是增加了一行文字。

我忽略了實際的CSS和HTML，因爲它比較冗長。

我想顯示#counter內聯（我可以用#counter .item {float：left}）做的內容，然後將它放在#text旁邊。

我無法在#text旁邊放置#content，並且如果可能，只能通過CSS。

希望這是清晰的。我很難把它寫成文字。

任何幫助或方向表示讚賞。

Answer 1

這是你在找什麼？如果不是，你能提供一個你想要的圖像的例子。

.wrapper { 
 
    width: 100%; 
 
} 
 

 
#banner { 
 
    width: 50%; 
 
    float: left; 
 
} 
 

 
#counter { 
 
    width: 50%; 
 
    float: left; 
 
}

<div class="wrapper"> 
 
    <div id="banner"> 
 
    <div id="image1" class="hidden"> Image .. </div> 
 
    <div id="text1" class="hidden"> Text .. </div> 
 
    <div id="image2" class="active"> Image .. </div> 
 
    <div id="text2" class="active"> Text .. </div> 
 
    </div> 
 
    <div id="counter"> 
 
    <div class="item1 hidden">1</div> 
 
    <div class="item2 active">2</div> 
 
    </div> 
 
</div>