tr边界不在右侧100%高度

时间:2015-05-17 12:28:32

标签: html css

为什么中间(tr' s之间)的边界不是100%高度?我怎么能改变它?这是一个演示:



.one_tutorial{
    display: block;
    border-collapse: collapse;
    border: 4px solid rgb(25, 25, 25);
}

.one_tutorial_title{
    display: inline-block;
    padding: 5px 20px;
    width: 300px;
    border-right: 4px solid rgb(25, 25, 25);
}

.one_tutorial_info{
    display: inline-block;
    padding: 5px 20px;
    width: 200px;
}

<table> 
    <tr class="one_tutorial"> 
        <td class="one_tutorial_title">Wie bewässere ich meine Pflanzen</td> 
        <td class="one_tutorial_info">Geschrieben von ???, am 17.05.2015 um 14:07 Uhr</td> 
    </tr> 
</table>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:2)

原因是5px的顶部/底部填充;这是您的解决方案:

Working:DEMO

<强> CSS

.one_tutorial_title{
    display: inline-block;
    padding: 10px 20px;/*Changed to 10px from 5px*/
    width: 300px;
    border-right: 4px solid rgb(25, 25, 25);
}

.one_tutorial_info{
    display: inline-block;
    padding: 0px 20px;/*Changed to 0px from 5px*/
    width: 200px;
}

答案 1 :(得分:0)

如果您将display应用于表格,则可以安全地删除对表格元素的table-layout: fixed;属性的更改。我假设你这样做是因为你表格单元格没有正确地考虑你分配给它们的宽度?