Html 调整表格列大小

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6776364/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 09:40:34  来源:igfitidea点击:

Table column resize

htmlcss

提问by Tomas

I have such table structure(I can replace with Div if it is possible to solve the problem suing them) and would like to set width of the left column to fixed size in pixels, for example 300px and make right column auto width to keep it resized from left column to the border of browser. My solution do not work in this situation.

我有这样的表格结构(如果可以解决起诉他们的问题,我可以用 Div 替换)并且想将左列的宽度设置为以像素为单位的固定大小,例如 300px 并使右列自动宽度以保持它从左栏调整到浏览器的边框。我的解决方案在这种情况下不起作用。

 <table>
   <tr>
        <td width="300"> 
            fixed size
        </td>
   </tr>
   <tr>
        <td width="100%"> 
             take free space
        </td>
   </tr>
 </table>

回答by Salman A

Using/suing DIVs:

使用/起诉 DIV:

<div style="background-color: lime; float: left; width: 300px;">fixed size</div>
<div style="background-color: cyan; margin-left: 300px;">take free space</div>

Demo here

演示在这里

回答by thirtydot

Using a table: http://jsfiddle.net/rtVzf/

使用tablehttp: //jsfiddle.net/rtVzf/

<table width="100%">
   <tr>
        <td width="300"> 
            fixed size
        </td>
        <td> 
            take free space
        </td>
    </tr>
</table>

回答by joeyslaptop

Try pinning your table to the left and specifying 100%, then making your left column a fixed width, and then pinning your right column to the right.

尝试将表格固定在左侧并指定 100%,然后将左列固定为固定宽度,然后将右列固定在右侧。

 <TABLE width="100%" height="100%" align="left" border="1">
       <TR>
         <TD width="300px" height="100% align="left" valign="top">
        <p align="left">Get rid of the border by changing it to 0 after you get all of your placement down.</p>
         </TD>
         <!--other TDs if desired-->
         <TD height="100%" align="right" valign="top">
           <p align="left">written stuff or images, etc.</p>
         </TD>
       </TR>
    </TABLE>

回答by supakeen

Your table should also have a width="100%" either through an attribute or through CSS.

您的表格还应该通过属性或 CSS 具有 width="100%" 。