我的
spring mvc应用程序中的布局有问题.在我的应用程序中,即使我设置了div的宽度参数,它也包含在div中的表.我尝试了许多解决方案,我googled但没有成功.这是我的jsp文件,css文件和我的应用程序的屏幕.正如你可以看到表中的文本很长,它不会破坏新行(我想要的).
css文件
th,td {
border-style: solid;
border-width: 5px;
border-color: #BCBCBC;
}
#all {
width: 500px;
}
#tablediv {
width: 400px;
float: left;
}
jsp文件
<body>
<h3>All your notes:</h3>
<c:if test="${!empty notes}"/>
<form method="post" action="manage_note">
<div id="all">
<div id="tablediv">
<table>
<tr>
<th class="widther">Note date</th>
<th>Description</th>
</tr>
<c:forEach items="${notes}" var="note">
<tr>
<td class="widther">${note.date} ${note.time}</td>
<td >${note.description}</td>
<td><input type="radio" name="chosen_note" value="${note.note_id}"></td>
</tr>
</c:forEach>
</table>
</div>
<div id="addbutton">
<input name="add_note" type="submit" value="Add note"/>
</div>
</div>
<div id="restbuttons">
<input name="edit_note" type="submit" value="Edit"/>
<input name="delete_note" type="submit" value="Delete"/>
</div>
</form>
</body>
这里是屏幕：
http://imageshack.us/photo/my-images/203/tableproblem.png/
感谢您的帮助.
解决方法
您需要做两件事来防止桌面变得太大.
1)将表格布局设置为固定：
table {
table-layout: fixed;
width: 100%;
}
2)将文字换成td / th的break-word
th,td {
border-style: solid;
border-width: 5px;
border-color: #BCBCBC;
word-wrap: break-word;
}
你可以在这里看到一个工作示例：http://jsfiddle.net/d6WL8/
