আমার এইচটিএমএল ডকুমেন্টের বডিটিতে 3 টি উপাদান, একটি বোতাম, একটি ফর্ম এবং একটি ক্যানভাস রয়েছে। আমি চাই বোতাম এবং ফর্মটি ডান সারিবদ্ধ হোক এবং ক্যানভাসটি বামদিকে বজায় থাকুক। সমস্যাটি যখন আমি প্রথম দুটি উপাদানগুলি সারিবদ্ধ করার চেষ্টা করি তখন তারা একে অপরকে অনুসরণ করে না এবং পরিবর্তে অনুভূমিকভাবে একে অপরের পাশে থাকে ?, আমার এখন পর্যন্ত কোডটি হ'ল, আমি ফর্মটি ডানদিকে বোতামের পরে সরাসরি অনুসরণ করতে চাই এর মধ্যে কোনও স্থান নেই।
#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;
কিন্তু এটি কার্যকর হয়নি যা আমাকে অবাক করেছিল কারণ আমি যে উপাদানটি ডানদিকে প্রান্তিককরণের চেষ্টা করছি তা আপেক্ষিক।