11
Tôi đang cố gắng tách một TD (ô bảng) để trông giống như là hai ô. Vấn đề là khi các tế bào phát triển trong chiều cao, tôi không thể làm cho hai divs bên trong để chiếm tất cả chiều cao có sẵn. Khi các ô này có thể phát triển động, tôi không thể đặt chiều cao cố định (hoặc có thể giải quyết vấn đề).Chia td thành hai số
Dưới đây là mã của tôi:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
td { border: 1px solid black; width: 50px; text-align: center; margin:0; padding:0 }
#span1 { background-color: #DDD; width: 25px; float: right; }
#span2 { background-color: #EEE; width: 24px; float: left; }
.t { border-top: 1px solid black; }
.r { border-right: 1px solid black; height: 100%; }
</style>
</head>
<body>
<table>
<tbody>
<tr>
<td>1</td><td>2</td><td>3<div><div id="span1" class="t">1</div><div id="span2" class="t r">1</div></div></td><td>4</td>
</tr>
<tr>
<td>1</td><td>2</td><td><div id="span1">3</div><div id="span2" class="r">3</div></td><td>4</td>
</tr>
<tr>
<td>1</td><td>2 2 2 2 2 22 2 </td><td><div id="span1">3</div><div id="span2" class="r">3</div></td><td>4</td>
</tr>
<tr>
<td>1</td><td>2</td><td><div id="span1">3</div><div id="span2" class="r">3</div></td><td>4</td>
</tr>
<tr>
<td>1</td><td>2 2 2 2 2 2 2 2 </td><td><span style="line-height:2"><div id="span1">3</div><div id="span2" class="r">3</div></span></td><td>4</td>
</tr>
</tbody>
</table>
</body>
</html>
Đây là cách nó trông:
Tôi không muốn nhìn thấy những khoảng trống màu trắng trong cột 3.
Bất kỳ ý tưởng nào để giải quyết vấn đề này? Tôi đã chiến đấu với CSS trong một thời gian mà không có may mắn cho đến nay ...
Cảm ơn !.
Và trên thực tế tách tds không phải là một lựa chọn? Sau đó, "3" trên đầu trang có thể là một td với 'colspan =" 2 "'. –
Bạn có nghĩa là, bằng cách sử dụng colspan và/hoặc rowspan? Nếu đó là trường hợp thì không, đó không phải là một lựa chọn. Mặc dù tôi có thể đặt bất cứ điều gì tôi muốn bên trong các tế bào (mà không sửa đổi số cột/hàng) –