2012-04-24 89 views
2

我很難將div放在彼此的旁邊,而不是將它們放在下面。我是新來的使用CSS,我不知道我需要做什麼。將div放在彼此的旁邊而不是在下面

的網頁是www.panduzee.com/wordpress

的文章「理查德·魯」的假設是旁邊的「阿什利李」。

的代碼的鏈接是:http://pastebin.com/J3CNMfaP 而CSS是:http://pastebin.com/isn5NViA

對不起,我試圖讓代碼這篇文章中工作,但它沒有正確地顯示出來。

任何幫助,將不勝感激! CSS來自wordpress主題,讓大家都知道。

謝謝!

+1

如果您在[JS小提琴(http://jsfiddle.net),或類似的發佈您的代碼,我們可以看到在行動頁面。並在那裏玩,使其工作,並看到任何變化造成的影響。 – 2012-04-24 21:37:51

回答

4

的jsfiddle(http://jsfiddle.net/BnJ7g/3/

你的 「盒子」 和 「boxes2」 的div

,添加float:left屬性。

<div id="boxes" style="float:left;"> 
    <div class="box"> 
     <!--The post title--> 
     Ashley Lee <!--The post image--> 
     <a href="http://www.panduzee.com/wordpress/2012/04/15/fashion/"><img width="210" height="312" src="http://www.panduzee.com/wordpress/wp-content/uploads/2012/04/527802_2560693355446_1797426028_1635316_739143794_n-210x312.jpg" class="attachment-homepage-thumb wp-post-image" alt="" title="" /></a> 
    </div>  
</div> 

<div id="boxes2" style="float:left;"> 
    <div class="box"> 
     Richard Lu <!--The post image--> 
     <a href="http://www.panduzee.com/wordpress/2012/04/24/richard-lu/"><img width="210" height="312" src="http://www.panduzee.com/wordpress/wp-content/uploads/2012/04/527802_2560693355446_1797426028_1635316_739143794_n-210x312.jpg" class="attachment-homepage-thumb wp-post-image" alt="" title="" /></a> 
    </div> 
</div> 

+0

謝謝,讓它工作。 – Richard 2012-04-26 01:27:21

+0

@RichardLu np :) – 2012-04-26 01:27:42