Image
CSS
.main { width: 100%;clear: both }
.left { width: 250px; background-color: #ffebcd; float: left }
.right { margin-left: 250px; background-color: #8a2be2; }
.main2 { width: 100%; clear: both }
.left2 { background-color: #ffebcd;
width: webkit-calc(100% - 250px);
width: -o-calc(100% - 250px);
width: -moz-calc(100% - 250px);
width: calc(100% - 250px);
float: left;
}
.right2 { width: 250px; background-color: #8a2be2; float: right;}
HTML
<!DOCTYPE html>
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"><!--<![endif]-->
<head>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div class="main">
<div class="left">Test</div>
<div class="right">test</div>
</div>
<div class="main2">
<div class="left2">Test</div>
<div class="right2">test</div>
</div>
</body>
</html>
No comments:
Post a Comment