Phần thân của tài liệu html của tôi bao gồm 3 phần tử, một nút, một biểu mẫu và một khung vẽ. Tôi muốn nút và biểu mẫu được căn phải và khung vẽ ở bên trái. Vấn đề là khi tôi cố gắng căn chỉnh hai yếu tố đầu tiên, chúng không còn theo dõi nhau nữa và thay vào đó nằm cạnh nhau theo chiều ngang?, Đây là mã tôi có, tôi muốn biểu mẫu theo dõi trực tiếp sau nút bên phải không có khoảng trống ở giữa.
#cTask {
background-color: lightgreen;
}
#button {
position: relative;
float: right;
}
#addEventForm {
position: relative;
float: right;
border: 2px solid #003B62;
font-family: verdana;
background-color: #B5CFE0;
padding-left: 10px;
}<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript" src="timeline.js"></script>
<link rel="stylesheet" href="master.css" type="text/css" media="screen" />
</head>
<body bgcolor="000" TEXT="FFFFFF">
<div id="button">
<button onclick="showForm()" type="button" id="cTask">
Create Task
</button>
</div>
<div id="addEventForm">
<form>
<p><label>Customer name: <input></label></p>
<p><label>Telephone: <input type=tel></label></p>
<p><label>E-mail address: <input type=email></label></p>
</form>
</div>
<div>
<canvas id="myBoard" width="1000" height="600">
<p>Your browser doesn't support canvas.</p>
</canvas>
</div>
</body>
</html>
margin-left: auto;nhưng điều đó không làm tôi ngạc nhiên vì yếu tố tôi đang cố gắng sắp xếp bên phải là tương đối.