表td寬度和浮標

晚上好！我在做這件事情：表td寬度和浮標

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

來源

2013-03-03 Martina

浮動表格單元並不是一個好主意。 – sevenseacat 2013-03-03 15:34:19

@sevenseacat好的。但即使我刪除浮動結果不會改變。如果我認爲浮動，我有3列在堆棧中。 – Martina 2013-03-03 15:35:38

你可以嘗試設置寬度爲600內部infoGen而不是800 – DevelopmentIsMyPassion 2013-03-03 15:36:32

你的CSS選擇器是不正確的。空格推斷後代

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

應該

/* TD that has ID=secondacol*/ 
td#secondacol

來源

2013-03-03 15:50:47 charlietfl

我在另一個文件css中出錯，所以我遇到了這個問題。 – Martina 2013-03-03 16:15:48

嘗試使用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-03 15:46:08 thequerist

無所事事...... :-( – Martina 2013-03-03 15:47:29

你的CSS規則是這樣的：

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

當它應該是這樣的：

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

注意TD和ID之間的空間被刪除。

不相關，但不能有多個相同的ID。改爲使用班級。 15年前還使用了FONT標籤。

此外，您不應該爲此佈局使用表格，因爲表格僅用於表格日期。

來源

2013-03-03 15:51:04

表td寬度和浮標

回答

相關問題