水平布局

Question

我正在解决一个问题,我正在尝试使用自动分页创建一个水平tumblr主题.我使用非常简单的表格进行布局:

<table><tr>
    <!--each post is here--><td></td><!--To here-->
</tr></table>

但这是问题所在.用于自动分页的Javascript工作非常简单.你必须将帖子放入div,但你不能将div放入tr或table.如果我将整个表放在div中,水平布局自然会中断.知道如何解决这个问题吗？

<div class="repeating-div">    
    <table><tr>
        <!--each post is here--><td></td><!--To here-->
    </tr></table>
</div>

编辑:它的外部脚本不是由我编写的,因此我必须将class放在div而不是row上,我真的不想花时间编写新的javascript代码

Answer 1

添加display:inline-block到您的DIV.使用此属性,多个DIV将相互容忍,水平.

不建议将表用于非tabulair数据.如果要向元素添加"table-behavior"(外观),请使用display:table加号display:table-row和/或display:table-cell.

Answer 2

使用内联div和white-space:nowrap在包装器div上.内容浮动到右边,从不打破这种方式.