Html表格缩进问题_Html_Css - Fatal编程技术网

Html表格缩进问题

html css

Html表格缩进问题,html,css,Html,Css,我有以下表格：标记为： <table style="width: 100%; padding:5px;"> <col style="width: 20%; text-align: left" /> <col style="width: 80%; text-align: left" /> <tr> <td> <div> Наименование</div>

我有以下表格：

标记为：

<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>


Наименование
Скважина
Дата начала
Основной вид работ в заявке

问题是:

如何消除另一个表中表格的这种可怕缩进？

尝试按如下方式设置内部表格的样式：

.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;
}

下面是一个如何使用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>


标签{
浮动：左；
宽度：10em；
右边距：1米；
}
.行{
浮动：左；
清除：左；
垫底：3em；
}
姓名：
电邮地址：
电话：

您的css代码，甚至是一个jsbin.com实时示例，都可以帮助我们从Devexpress控件中获得一个运行时格式的css。所有其他css都在这里（请不要问为什么它在每个标记中实现，而不是在文件中实现）。而且：直觉告诉我们，问题不在Devexpress的CSS中。缩进已经减少，现在它非常小，大小接近1px。但它仍然在那里。请再加一个CSS属性？：）也许您还需要设置表格行和单元格的样式。请参阅我的最新答案。