% 100 genişliğe sahip giriş öğelerinin neden tablonun hücre sınırını aştığını bilen var mı?
Aşağıdaki giriş kutusunun tablonun hücre sınırını aşan basit örneğinde, sonuç korkunçtur. Bu test edildi ve şu şekilde oluyor: Firefox, IE7 ve Safari.
Senin için mantıklı mı? Bir şey mi kaçırıyorum, olası bir çözüm hakkında bir fikriniz var mı?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <!-- don't use closing slash in meta tag, it breaks HTML4.01 transitional -->
<title>Test input text in table</title>
<style type="text/css">
table {border-top: 1px solid #ff0000; border-left: 1px solid #ff0000;}
table td {border-right: 1px solid #00ff00; border-bottom: 1px solid #00ff00;}
input[type="text"] {width: 100%;} /* removing this would make input not to go over cells border, but they would be too short, I want them to fit cells size */
</style>
</head><body>
<table cellpadding="0" cellspacing="0">
<tr>
<td><p>column one hello babe babe babe</p></td>
<td><p>column two hello babe more</p></td>
<td><p>column three hello babe more and more</p></td>
</tr>
<tr>
<td><input type="text" value="test"></td>
<td><input type="text" value="test"></td>
<td><input type="text" value="test"></td>
</tr>
</table>
</body></html>
formile a kullanmaya geçebilirsiniz . bu, en azından biraz daha anlamsaldır. Kesinlikle olsa da ,.labelinputulolformtable