如何在一个图例中使用overflow-x创建一个表 [英] How to create a table within a legend with overflow-x

问题描述

有人可以告诉我如何在一个图例中创建一个表格，如果它的大小超过了div，它会创建一个滚动条。

can someone tell me how i can create a table within a legend which creates a scrollbar if th its bigger than the div in which is it.

<div style="width:700px;">
<h1>wefwfwfwef</h1>
<fieldset>
    <div style="width:700px;">
    <label>sdfsdfsdj dfsdfsdfsdj sdfsdfsdfsdfsdj sdfsdfsdfsdfsdj sdfsdf</label>
    <table style="background-color:white;color:black;"> <!-- This table should only be 700 px width... without width definition (because its display:block)-->
        <tr>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
        </tr>
    </table>
    </div>
</fieldset>
<div style="width: 100%;background-color:black;overflow-x:auto;">
    <table style="background-color:white;color:black;display:block"> 
        <tr>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
            <td>ehehef<td>
        </tr>
    </table>
<div>
</div>

推荐答案

这样的东西？ http://jsbin.com/ubomo4

如果只需在下的 div 的css属性中添加 overflow-x：scroll; fieldset 。

If yes just add overflow-x:scroll; in the css properties of the div under the fieldset.

这篇关于如何在一个图例中使用overflow-x创建一个表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！