Skip to content

Instantly share code, notes, and snippets.

@house9

house9/css-rows-and-columns.html

Created March 29, 2011 15:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save house9/892551 to your computer and use it in GitHub Desktop.
Save house9/892551 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
css-rows-and-columns.html
<html>
<head>
<title>css rows and columns</title>
<style type="text/css">
body {
font-family: Verdana;
}
div.rows div.row {
clear:both;
border-bottom: 1px dashed black;
width: 100%;
}
div.rows div.column {
float: left;
}
div.rows div.clear-row {
line-height: 0px;
font-size: 0px;
clear:both;
}
.w-70-percent {
width: 70%;
}
.w-30-percent {
width: 30%;
}
#container {
margin: auto;
width: 70%;
border: 2px solid black;
}
</style>
</head>
<body>
<div id="container">
<div class="rows">
<div class="row">
<div class="column w-70-percent">
Row 1 / Column 1
</div>
<div class="column w-30-percent">
Row 1 / Column 2
</div>
<div class="clear-row">
&nbsp;
</div>
</div>
<div class="row">
<div class="column w-70-percent">
Row 2 / Column 1
</div>
<div class="column w-30-percent">
Row 2 / Column 2
</div>
<div class="clear-row">
&nbsp;
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment