0

晚上好!我正在做这件事:

<div id="infoGen" align="center">
    <table id="tabInfoGen">
        <tr>
            <td id="primacol">Nome:&nbsp;<font id="h3"><%=u.getNome()%></font><br>
                Cognome:&nbsp; <font id="h3"><%=u.getCognome()%></font><br>
                Indirizzo:&nbsp; <font id="h3"><%=u.getIndirizzo()%></font><br>
                Città:&nbsp;<font id="h3"><%=u.getCitta()%></font>
            </td>
            <td id="secondacol">Data di Nascita:&nbsp; <font
                id="h3"><%=u.getDataNascita()%></font><br> Luogo di
                Nascita:&nbsp;<font id="h3"> <%=u.getLuogoDiNascita()%></font><br>
                Telefono:&nbsp;<font id="h3"> <%=u.getTelefono()%></font><br>
                Email:&nbsp; <font id="h3"><%=u.getEmail()%></font>
            </td>
            <td id="terzacol">Username:&nbsp; <font id="h3"><%=u.getUsername()%></font>
                <br> Password:&nbsp; <font id="h3"> <%
for (int i = 0; i < u.getPassword().length(); i++)
    out.print("*");
  %>
                </font>
            </td>
        </tr>
    </table>
</div>

有了这个 CSS

#infoGen {
background-color: #F2F5A9;
width: 800px;
border-radius: 20px;
border: 1px solid black;
}

 #infoGen table {
width: 100%;
padding-top: 20px;
padding-bottom: 20px;
padding-left: 10px;
padding-right: 10px;
font: 16px Impact, sans-serif;
text-align: left;
 }
 td #primacol {
float: left;
margin-left: 50px;
width: 200px;
}

td #secondacol {
width: 200px;
float: left;
margin-left: 20px;
}

td #terzacol {
float: left;
margin-left: 50px;
width: 200px;
}

问题是我想要 3 列具有相同的宽度,但在这种情况下,我的第一列非常大,另外两列很小。我怎样才能解决这个问题?

http://jsfiddle.net/

4

3 回答 3

1

你有这样的css规则:

td #primacol {
    float: left;
    margin-left: 50px;
    max-width: 200px;
}

什么时候应该是这样的:

td#primacol {
    float: left;
    margin-left: 50px;
    max-width: 200px;
}

注意 TD 和 ID 之间删除的空格。

不相关,但您不能拥有多个相同的 ID。改用一个类。使用 FONT 标签也是 15 年前的事了。

此外,您不应在此布局中使用表格,因为表格仅适用于表格日期。

于 2013-03-03T15:51:04.330 回答
0

尝试使用max-width

td#primacol {
    margin-left: 50px;
    max-width: 200px;
}

td#secondacol {
    max-width: 200px;
    margin-left: 20px;
}

td#terzacol {
    margin-left: 50px;
    max-width: 200px;
}
于 2013-03-03T15:46:08.157 回答
0

您的 CSS 选择器不正确。空间推断后代

/* look for id=secondacol within any TD*/
td #secondacol

应该

/* TD that has ID=secondacol*/
td#secondacol
于 2013-03-03T15:50:47.220 回答