6
Tôi có hai divs, một trong những quyền là 80px rộng khác nên lấp đầy không gian còn lại. Cho đến nay tôi đã thử:Làm thế nào để bạn đặt hai divs bên cạnh nhau để họ điền vào không gian có sẵn
<!DOCTYPE html>
<html>
<head>
<title>#{get 'title' /}</title>
<style type="text/css">
body {
margin: 0;
padding: 0;
}
#left {
position: relative;
margin-right: 80px;
background-color: red;
}
#right {
float: right;
position: relative;
text-align: left;
width: 80px;
background-color: yellow;
}
</style>
</head>
<body>
<div id="left">
Left
</div>
<div id="right">
Right
</div>
</body>
</html>
Tuy nhiên, hộp bên phải luôn được đặt bên dưới hộp bên trái và không được đặt bên dưới hộp bên trái. Tôi đoán đó là vì lợi nhuận. Tôi cũng đã thử một lề trái: -80px ở bên phải nhưng điều này dường như không thay đổi bất cứ điều gì. Vì vậy, làm thế nào để tôi phải thay đổi CSS để div bên phải là trong cùng một dòng như div trái?
này hoạt động, và có vẻ là dễ nhất trong những giải pháp đề nghị. Cảm ơn bạn! Những gì tôi không nhận được là, tại sao điều này là làm việc. Bạn có thể giải thích tại sao? –
Vì các phần tử được vẽ theo thứ tự, thay vì di chuyển xuống qua phần tử bên trái để vẽ bên phải, bên phải được vẽ trước và bên trái được vẽ xung quanh phần tử bên phải. –
Tôi hiểu. Cảm ơn bạn :) –