<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
Equal Height in Css <style type="text/css"> #container { width: 150px; float: left; padding: 0; background: #0099FF; } #sidebar { width: 150px; float: left; padding: 0; background: #FF0000; } #sidebar1 { width: 150px; float: left; padding: 0; background: #33FF00; } <script type="text/javascript" src="x.js"> <script type="text/javascript"> function adjustLayout() { // Get natural heights var cHeight = xHeight("container"); var lHeight = xHeight("sidebar"); var rHeight = xHeight("sidebar1"); alert(cHeight); alert(lHeight); alert(rHeight); // Find the maximum height var maxHeight = Math.max(cHeight, Math.max(lHeight, rHeight)); // Assign maximum height to all columns xHeight("container", maxHeight); xHeight("sidebar", maxHeight); xHeight("sidebar1", maxHeight);
}
// Show the footer xShow("footer");
window.onload = function() { xAddEventListener(window, "resize", adjustLayout, false); adjustLayout(); }
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis mauris est, ultrices a, ullamcorper eget, pharetra nec, leo. Duis in nisl. Ut volutpat leo non dolor. Mauris diam ipsum, commodo eget, feugiat molestie, feugiat quis, lacus. Suspendisse at nibh id metus lacinia rutrum. Nunc nisl. Vivamus mi. Maecenas vitae odio. |