Menu
Community /Pin to ProfileBookmark
———————————–
@NogDogOct 03.2005 — #One possibility, if you want a "fluid" layout:
DIV divided into columns
Hi,
Please how I divide the following in three columns and 2 levels?
<h3><A href=”#”>Countries</a></h3>
<A href=”#”>USA</a>
<A href=”#”>UK</a>
<h3><A href=”#”>Languages</a></h3>
<A href=”#”>English</a>
<A href=”#”>Spanish</a>
<A href=”#”>German</a>
<h3><A href=”#”>Cities </a></h3>
<A href=”#”>London</a>
<A href=”#”>Sacramento</a>
———————————–
<h3><A href=”#”>Teams</a></h3>
<A href=”#”>Milan</a>
<A href=”#”>Real Madri</a>
<h3><A href=”#”>People</a></h3>
<A href=”#”>Artists</a>
<A href=”#”>Jenifer</a>
<A href=”#”>Wihona</a>
<h3><A href=”#”>Cars </a></h3>
<A href=”#”>Toyota</a>
<A href=”#”>Porsche</a>
Thank you
jLee
Sign in
to post a comment3 Comments(s) ↴
0
@NogDogOct 03.2005 — #One possibility, if you want a "fluid" layout:[code=html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang='en'>
<head>
<META HTTP-EQUIV='Content-Type' CONTENT='text/html; charset=ISO-8859-1'>
<title>Page title</title>
<style type="text/css">
<!--
.group {
margin: 0;
padding: 0;
clear: both;
}
.group div {
float: left;
width: 28%;
margin: 0;
padding: 2%
}
.group ul {
list-style: none;
margin: 0;
padding: 0;
}
-->
</style>
</head>
<body>
<div class="group">
<div>
<h3><A href="#">Countries</a></h3>
<ul>
<li><A href="#">USA</a></li>
<li><A href="#">UK</a></li>
</ul>
</div>
<div>
<h3><A href="#">Languages</a></h3>
<ul>
<li><A href="#">English</a></li>
<li><A href="#">Spanish</a></li>
<li><A href="#">German</a></li>
</ul>
</div>
<div>
<h3><A href="#">Cities </a></h3>
<ul>
<li><A href="#">London</a></li>
<li><A href="#">Sacramento</a></li>
</ul>
</div>
</div>
<div class="group">
<div>
<h3><A href="#">Teams</a></h3>
<ul>
<li><A href="#">Milan</a></li>
<li><A href="#">Real Madri</a></li>
</ul>
</div>
<div>
<h3><A href="#">People</a></h3>
<ul>
<li><A href="#">Artists</a></li>
<li><A href="#">Jenifer</a></li>
<li><A href="#">Wihona</a></li>
</ul>
</div>
<div>
<h3><A href="#">Cars </a></h3>
<ul>
<li><A href="#">Toyota</a></li>
<li><A href="#">Porsche</a></li>
</ul>
</div>
</div>
</body>
</html>
[/code]