Saturday, July 16, 2011

Creating columns in website

This tutorial shows how to create columns in website and prevents the div from wrapping when the browser is minimized






Syntax Source:
<html>
<head>
<style>
#main {
width: 600px;
}

.col {
float: left;
border: 1px solid red;
padding: 10px;
margin: 0px 20px 0px 0px;
}
</style>
</head>
<body>

<h1>Columns</h1>
<div id="main">
<div class="col">
<h3>Title</h3>
<p>asdfasdfxiv</p>
<p>asdfasdfxiv</p>
<p>asdfasdfxiv</p>
</div>
<div class="col">
<h3>Title</h3>
<p>asdfasdfxiv</p>
<p>asdfasdfxiv</p>
<p>asdfasdfxiv</p>
</div> <div class="col">
<h3>Title</h3>
<p>asdfasdfxiv</p>
<p>asdfasdfxiv</p>
<p>asdfasdfxiv</p>
</div>
</div>
</body>
</html>


No comments:

Post a Comment