Tôi có hai cột cạnh nhau có các màu khác nhau. Nền cũng có một màu duy nhất. Cột bên phải chứa văn bản sẽ mở rộng đến chiều cao không xác định. Cột khác chứa ít hoặc không có gì.CSS thay thế cho mã CSS-jQuery này?
<div id="container">
<div id="leftColumn">
<p>Only one small paragraph here</p>
</div>
<div id="rightColumn">
<p>Many large paragraphs inside here.</p>
</div>
</div>
Tôi muốn cột bên trái chính xác là chiều cao làm cột bên phải.
Đây là CSS ...
#leftColumn {
display:inline-block;
width: 200px;
}
#rightColumn {
display:inline-block;
width: 600px;
vertical-align: top;
}
Vì vậy, khi tải trang Tôi sử dụng jQuery để thiết lập chiều cao của cột bên trái dựa trên chiều cao của cột bên phải.
$(document).ready(function() {
$('#leftColumn').css('height', $('#rightColumn').innerHeight());
});
Có cách nào để làm điều này chỉ với CSS không?
CSS có thể không phải là công cụ duy nhất cho công việc khi các công cụ khác cho vay mình tốt hơn để một probl em. Bảng HTML không phải là điều ác; mặc dù chúng có thể đã bị lạm dụng trong quá khứ trước khi hỗ trợ CSS tốt, nhưng Tables vẫn có vị trí của chúng.Khi bạn đang nói về chiều cao bằng nhau, Bảng tự động có điều đó và vẫn có thể được kiểm soát thông qua CSS, cho một giải pháp lai sử dụng tốt nhất của cả hai thế giới. Nếu không, nó có thể trở nên phức tạp nhanh chóng nếu sử dụng một công cụ để loại trừ những người khác vì lợi ích của nó. –
Sau đó, một lần nữa tác giả đã yêu cầu một giải pháp CSS duy nhất để có thể cố gắng thực thi lý tưởng của chúng tôi để loại trừ trả lời trực tiếp câu hỏi đang làm việc chống lại quá trình. –