HTML表格缩进问题

alt text

标记是：

<table style="width: 100%; padding:5px;"> 
<col style="width: 20%; text-align: left" /> 
<col style="width: 80%; text-align: left" /> 
<tr> 
    <td> 
     <div> 
      Наименование</div> 
    </td> 
    <td> 
     <dx:ASPxButtonEdit ID="beWorkTypeName" runat="server" AutoPostBack="False"> 
      <Buttons> 
       <dx:EditButton> 
       </dx:EditButton> 
      </Buttons> 
     </dx:ASPxButtonEdit> 
    </td> 
</tr> 
<tr> 
    <td> 
     <div> 
      Скважина</div> 
    </td> 
    <td> 
     <dx:ASPxButtonEdit ID="beWell" runat="server" AutoPostBack="False"> 
      <Buttons> 
       <dx:EditButton> 
       </dx:EditButton> 
      </Buttons> 
     </dx:ASPxButtonEdit> 
    </td> 
</tr> 
<tr> 
    <td> 
     <div> 
      Дата начала</div> 
    </td> 
    <td> 
     <table> 
      <tr> 
       <td> 
        <dx:ASPxDateEdit ID="deBeginDate" runat="server"> 
        </dx:ASPxDateEdit> 
       </td> 
       <td> 
        <dx:ASPxButton ID="btnDateChange" AutoPostBack="false" Enabled="false" Text="Изменить дату" 
         runat="server"> 
        </dx:ASPxButton> 
       </td> 
       <td> 
        <dx:ASPxCheckBox ID="cbIsMainWorkType" Enabled="false" runat="server"> 
        </dx:ASPxCheckBox> 
       </td> 
       <td> 
        <div> 
         Основной вид работ в заявке</div> 
       </td> 
      </tr> 
     </table> 
    </td> 
</tr>

的问题是：如何摆脱表的这个可怕的缩进在另一张桌子内？

来源

2010-11-09 Daniel Ganiev

你的CSS代码，甚至jsbin.com活生生的例子可以帮助我们 – Sotiris 2010-11-09 11:45:38

我只有一个运行时形成的CSS，从DevExpress的控件。所有其他的CSS在这里（不要问为什么它在每个标签中实现，而不是在文件中，请）。 AND：Intuition说这个问题不在Devexpress的CSS中。 – 2010-11-09 11:51:48

尝试的风格你的内心表如下：

.innerTable { 
    border: 0px; 
    border-collapse: collapse; 
    margin: 0px; 
    padding: 0px; 
}

编辑：您可能还需要从表中的行和清除细胞间距：

.innerTable tr { 
    border: 0px; 
    margin: 0px; 
    padding: 0px; 
} 

.innerTable th { 
    border: 0px; 
    margin: 0px; 
    padding: 0px; 
} 

.innerTable td { 
    border: 0px; 
    margin: 0px; 
    padding: 0px; 
}

来源

2010-11-09 11:44:34

缩进缩小了，现在非常小，接近1px。但它仍然存在。可能还有一个CSS属性？ :) – 2010-11-09 11:47:42

也许你还需要风格的表格行和单元格。看到我更新的答案。 – 2010-11-09 11:50:40

现在完美了，谢谢。 – 2010-11-09 11:55:03

这里有一个如何的例子使用CSS布局表单元素而不使用表格 - 希望它会有所帮助？关键在于设置标签元素的宽度，然后将输入控件设置到正确的阵容。

<html> 
<head> 
<style type="text/css"> 
label { 
float: left; 
width: 10em; 
margin-right: 1em; 
} 

.row { 
float: left; 
clear: left; 
padding-bottom: .3em; 
} 
</style> 
</head> 
<body> 

<form action="example.php"> 
<div class="row"> 
<label for="name">Name:</label> 
<input id="name" name="name" class="text" type="text" /> 
</div> 
<div class="row"> 
<label for="email">Email address:</label> 
<input id="email" name="email" class="text" type="text" /> 
</div> 
<div class="row"> 
<label for="phone">Telephone:</label> 
<input id="phone" name="phone" class="text" type="text" /> 
</div> 

<div class="row"> 
<input class="submit" type="submit" 
value="Submit" /> 
</div> 
</form> 

</body> 
</html>

来源

2010-11-09 11:46:13

HTML表格缩进问题

回答

相关问题