Question

我想为div设置背景颜色，div是具有overflow-x auto的div容器的一部分。我不确定需要应用哪种样式来允许div包装仅在滚动时可见的文本。如果我设置display：block;这就是将div设置为可见的内容：

 <div id="container">
        <div class="section">
            <div class="title">First</div>
            <div class="data">
                <table class="table">
                    <tr>
                        <td>
                            First of the rows and all that data
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Second of the rows and all that data
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Third of the rows and all that data
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Fourth of the rows and all that data
                        </td>
                    </tr>
                </table>
            </div>
            <div class="title">Second</div>
            <div class="data">
                <table class="table">
                    <tr>
                        <td>
                            First of the rows and all that data
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Second of the rows and all that data
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Third of the rows and all that data
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Fourth of the rows and all that data
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

（例如http://jsfiddle.net/u7ah3/1/）但是，如果我减少#container宽度（从400到200），那么当水平滚动时，可以看到div没有环绕文本。我尝试使用display：inline-block但是当容器比块块更宽时，它不起作用。

谢谢。

Answer 1

为什么不仅仅设置td的样式......？

.table, td {
    min-width:300px;
    background:#bbb;
}

此外，您应该在已包含的min-width上设置section divs，例如：

.section {
    min-width:300px;
}

JS Fiddle ：http://jsfiddle.net/SinisterSystems/u7ah3/7/

我相信我理解正确的问题。如果我出错了，请随意发表评论，我可以进一步提供帮助。

溢出为自动时背景颜色不延伸

1 个答案: