Thursday, 15 August 2013

How to set the height of divs in basic layout

How to set the height of divs in basic layout

I'm trying to set the size of 2 divs to fill the page with a 70 - 30 % ratio.
Without setting the size of the "html ,body" how can i get the divs to
display to the correct height.
Currently it displays two single lines the height of the text. Thanks
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
</head>
<body>
<div style="overflow: hidden; clear: both;">
<div style="background-color: blue; height: 70%;">Top</div>
<div style="background-color: red; height: 30%;">bottom</div>
</div>
</body>
</html>

No comments:

Post a Comment