|
rubyaim -> RE: How can I do this without a table? (5/3/2006 19:03:50)
|
Hi Duane, another option using a definition list. I've been playing around with code from Max Design.
Forgive the nursery rhymes, I get bored with latin text.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=windows-1252" />
<title>DL Test</title>
<style type="text/css">
dl.rhyme {
margin: 2em 0;
padding: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 0.85em;
}
.rhyme dt {
width: 10%;
float: left;
margin: 0;
padding: .5em;
font-weight: bold;
}
/* commented backslash hack for mac-ie5 \*/
dt { clear: both; }
/* end hack */
.rhyme dd {
float: left;
width: 80%;
margin: 0;
padding: .5em;
}
</style>
</head>
<body>
<dl class="rhyme">
<dt>Diddle</dt>
<dd>Hey, diddle, diddle, The cat and the fiddle, The cow jumped over the moon. The little dog laughed To see such sport, And the dish ran away with the spoon.</dd>
<dt>Twinkle</dt>
<dd>Twinkle, twinkle, little star, How I wonder what you are. Up above the world so high, Like a diamond in the sky. Twinkle, twinkle, little star, How I wonder what you are.</dd>
<dt>Pussycat</dt>
<dd>Pussycat, pussycat, where have you been? I've been to London to visit the Queen. Pussycat, pussycat, what did you there? I frightened a little mouse under her chair.</dd>
<dt>Spider</dt>
<dd>Eencey Weencey spider, climed up the water spout; Down came the rain, and washed poor Eencey out; Out came the sun, and dried up all the rain; And the Eencey Weencey spider, climbed up the spout again.</dd>
</dl>
</body>
</html>
|
|
|
|
