I have a main division in which two divisions are presentOne is left DIV and another is right DIVFiddle HereHTML is\[code\]<div class="main"> <div class="left"> Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. Lorem Ipsum is a dummy text. </div> <div class="right"> some text heresome text heresome text heresome text heresome text heresome text heresome text heresome text heresome text here </div </div>\[/code\]And CSS is\[code\]body{ background-color:black; }.main{ width:80%; background-color:White; opacity:0.9; margin-left:auto; margin-right:auto; margin-top:25px;}.left{ width:68%; float:left; background-color:White; padding:2%; font-family:Calibri;}.right{ background-color:White; width:26%; padding:1%; float:right;}\[/code\]I want both the DIVs must be of equal height always.No matter how much text is present in it.Now Height of my right DIV is less than left DIV as in fiddle.Help Me. Thanks in Advance