我需要桌子上的一些区域滚动条？

Question

请找到图像，您可以查看Jan和Dec列，我需要为两列放置滚动条，因为两列空间区域有1到12个月。

桌子可以吗？

请帮助我！

上述问题得到了很好的答案。

另一个帮助！

http://jsfiddle.net/anglimass/Ty29z/

请找到图像并且您可以查看（供应商1报价）和（供应商6报价）列，我需要在两列空间区域（供应商1报价）的意义上为该两列放置一个滚动条（供应商6报价）供应商详细信息

Answer 1

我不相信这是可能的。我尝试通过样式化colgroup但这不起作用。

Example of tried solution

我认为这样做的唯一另一种方法是将你的表分成三个独立的表，中间的表包装div。

Example of split up table with div separator

Answer 2

试试这个：

<强> HTML

<table style="text-align: left; width: 100%;" border="1" cellpadding="2" cellspacing="2">
<tbody>
    <tr>
        <th>Header 1</th>
        <th>Header 2</th>
        <th colspan="1" rowspan="5" style="border: medium none ; width: 100px; vertical-align: top;">
            <div class="inner-table">
                <table style="text-align: left; width: 500px; border:none" border="1" cellpadding="2" cellspacing="2">
                <tbody>
                    <tr>
                        <th>Header 1</th>
                        <th>Header 2</th>
                        <th>Header 3</th>
                        <th>Header 4</th>
                    </tr>
                    <tr>
                        <td>a</td>
                        <td>a</td>
                        <td>a</td>
                        <td>a</td>
                    </tr>
                    <tr>
                        <td>b</td>
                        <td>b</td>
                        <td>b</td>
                        <td>b</td>
                    </tr>
                    <tr>
                        <td>c</td>
                        <td>c</td>
                        <td>c</td>
                        <td>c</td>
                    </tr>
                </tbody>
                </table>
            </div>
        </th>
        <th>Header 4</th>
    </tr>
    <tr>
        <td>a</td>
        <td>a</td>
        <td>a</td>
    </tr>
    <tr>
        <td>b</td>
        <td>b</td>
        <td>b</td>
    </tr>
    <tr>
        <td>c</td>
        <td>c</td>
        <td>c</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</tbody>
</table>

<强> CSS

.inner-table {
    width:100px;
    overflow-x:scroll;
}

th {
    height:20px;
}

演示

http://jsfiddle.net/andresilich/caq8F/4/

您可以轻松使用CSS来轻松获得相同的风格。

::编辑::清理代码并更新小提琴以包含滚动条的一些空间。