<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
div.Outer {
width: 350px;
border:dashed 1px black;
position: relative;
clear: both;
}
div.InnerLeft {
width: 50%;
position: relative;
background: #CCCCCC;
float: left;
}
div.InnerRight {
width: 49%;
position: relative;
background: #AAAAFF;
float: right;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="Outer">
<div class="InnerLeft">
Lorem Ipsum Lorem Ipsum Lorem Ipsum
Lorem Ipsum Lorem Ipsum Lorem Ipsum
Lorem Ipsum Lorem Ipsum Lorem Ipsum
Lorem Ipsum Lorem Ipsum Lorem Ipsum
Lorem Ipsum Lorem Ipsum Lorem Ipsum
</div>
<div class="InnerRight">
Lorem Ipsum Lorem Ipsum Lorem Ipsum
Lorem Ipsum Lorem Ipsum Lorem Ipsum
Lorem Ipsum Lorem Ipsum Lorem Ipsum
Lorem Ipsum Lorem Ipsum Lorem Ipsum
Lorem Ipsum Lorem Ipsum Lorem Ipsum
</div>
</div>
</form>
</body>
</html>
OUTPUT
comments
2 Responses to "Aligning two div's next to each other using CSS"This will only work if the text in the left and the text in the right box have the same length? Or err I?
you have no idea how grateful i am. thanks a ton
Post a Comment