将div放在彼此旁边而不是下面

时间:2012-04-24 21:36:04

标签: css wordpress html

我在将div放在一起而不是将它们放在下面时遇到了麻烦。我是新手使用CSS,我不确定我需要做什么。

该网页是www.panduzee.com/wordpress

帖子“Richard Lu”被认为是“Ashley Lee”的旁边。

代码的链接是:http://pastebin.com/J3CNMfaP CSS是:http://pastebin.com/isn5NViA

抱歉,我尝试在此帖子中使用该代码,但它没有正确显示。

任何帮助将不胜感激! CSS来自wordpress主题,只是让大家都知道。

谢谢!

1 个答案:

答案 0 :(得分:4)

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

在“box”和“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>