设置填充/溢出表的余量

我有一个表格，住在一个div内。该表中有一个与窗口重叠的巨大内容，因此我需要向左滚动以查看其内容。问题在于表格右侧没有填充或边距，使其更易于阅读。设置填充/溢出表的余量

如何向该表格添加填充或边距？

下面是HTML的样子（请注意，下面的CSS不工作）：

<html> 
<head></head> 
<body> 
<div id="table"> 
    <table> 
     <thead>...</thead> 
     <tbody>...</tbody> 
    </table> 
</div> 
<style> 
table td, table th, table td {border: 1px solid red} 
table { padding-right: 100px; border: 1px solid blue} 
table thead, table tbody {padding-right: 100px;} 
</style> 
</body> 
</html>

来源

2013-01-15 petwho

将css放在head部分..或者在.css文件中并在head标签中创建链接 –

当然，这仅仅是为了演示目的 – petwho

感谢您的回答。但是，我发现通过javascript实现它更容易，而且非常灵活。在这里，我正在使用jQuery框架：

$('#table').width() = $('table').width() + 20; 
$('table').css('padding-right', '10px');

这将使表的宽度，因为它第一次打算是。

来源

2013-01-15 09:40:08 petwho

只需添加display: inline-block;表

来源

2013-01-15 07:30:52

你可以试试这个？

<style type="text/css"> 
     #table table td,#table table th,#table table td {border: 1px solid red} 
     #table table { padding-right: 100px;color: blue} 
     #table table thead,#table table tbody {padding-right: 100px;} 
</style>

来源

2013-01-15 07:44:22 midstack

HI midstack，谢谢你的回答。你的解决方案似乎首先起作用。但是，当我将样式应用于表格时（通过向其添加边框）。它不起作用，因为我打算这样做。你能回顾一下你的答案吗？谢谢。 – petwho

你能把它写成：\t \t #table table，#table table td，#table table th {border：1px solid＃F00;} #table table {padding-right：100px;颜色：＃00F;} #table table thead，＃table table tbody {padding-right：100px;} \t我已经尝试过并且工作正常，但您必须将填充作为边距以使其看起来不错 – midstack

在CSS中，你不需要前缀。或＃表，TD，TR，P，

在您的问题

，在这里添加如下代码

#table table thead, table tbody {padding-right: 100px;}

注意＃......＃因为是id选择。

好运..！

来源

2013-01-15 07:52:21 Venkat

设置填充/溢出表的余量

回答

相关问题