0

我正在尝试在字段集中格式化表格，两者都在表单内。这是HTML代码：

<!DOCTYPE html>
<html>
<head>
<style>
fieldset{width:90%;}
table {width:100%;border-collapse:collapse;}
table,td {border:1px solid black;}
td.abc {width:40%;}
</style>
</head>
<body>
<form>
    <fieldset>
        <legend>Text Text</legend>
        <table>
        <tr>
            <td> Text </td>
            <td class="abc"> 
                <input size='25' type="text"/>
                <select>
                    <option>Text text text</option>
                    <option> Text </option>
                </select>
            </td>
            <td>
                Text text
            </td>
        </tr>
        <tr>
            <td> Text </td>
            <td class="abc"> 
                <input size='25' type="text"/>
                <select>
                    <option>Text text text</option>
                    <option> Text </option>
                </select>
            </td>
            <td>
                Text text
            </td>
        </tr>
        </table>
    </fieldset>
</form>

</body>
</html>

我的问题是，当我放大浏览器（通过按 ctr 和 + 键）时，如何使文本输入和选择保持在同一行。提前致谢！

4

2 回答 2

1

我同意 Sandeep 的观点——我一直在使用表格时遇到问题，而是使用标签和 css 去@HTMLhelpers 进行格式化。我对放大没有任何问题，这是一个适合老年人、视障人士等的好功能。

这是一个联系页面片段，类似于您想要对字段集执行的操作：

<fieldset>
    <legend>Contact</legend>

<div class="editor-label">
    *@Html.LabelFor(model => model.FirstName)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.FirstName)
    @Html.ValidationMessageFor(model => model.FirstName)
</div>

<div class="editor-label">
    *@Html.LabelFor(model => model.LastName)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.LastName)
    @Html.ValidationMessageFor(model => model.LastName)
</div>

<div class="editor-label">
    *@Html.LabelFor(model => model.EmailAddress)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.EmailAddress)
    @Html.ValidationMessageFor(model => model.EmailAddress)
</div>
    <input type="submit" value="Submit" /> &nbsp;
    <input type="reset" value="Reset" />

</fieldset>
于 2012-10-31T13:27:58.107 回答
1

忘记表格，使用 DIV。这是解决问题的唯一方法。

于 2012-10-31T13:19:52.163 回答