avoiding a one row table

#1 July 7th, 2008, 09:05 PM

I'm trying to learn how to use CSS rather than burdening my code with
lots of tables.

I've got content that I would normally place in a one row, 3 column
table. How to I do this using css instead? The following doesn't work
nor does moving the various inner div's around

<div width="100%">
<div style="float:right">1111</div>
<div style="float:right">2222</div>
<div style="float:right">3333</div>
</div>

I've also tried the following.
<div width="100">
<div>1111</div>
<div style="float:right">
<div>2222</div>
<div style="float:right">3333</div>
</div>
</div>

Neither of these approaches gives me the three div's in a row. Any
hints would be appreciated!!

David

#2 July 7th, 2008, 10:55 PM

Maybe this:

http://css.maxdesign.com.au/floatutorial/

tutorial 2 and 3 might help?

H.

"David Schwartz" <davids58@gmail.comschreef in bericht
news:7ca7ba19-5a7b-4ebd-ae4e-28c3b7ce1429@m44g2000hsc.googlegroups.com...

Quote:

I'm trying to learn how to use CSS rather than burdening my code with
lots of tables.

#3 July 8th, 2008, 03:15 AM

In article
<7ca7ba19-5a7b-4ebd-ae4e-28c3b7ce1429@m44g2000hsc.googlegroups.com>,
David Schwartz <davids58@gmail.comwrote:

Quote:

I'm trying to learn how to use CSS rather than burdening my code with
lots of tables.
>
I've got content that I would normally place in a one row, 3 column
table. How to I do this using css instead? The following doesn't work
nor does moving the various inner div's around
>
<div width="100%">
<div style="float:right">1111</div>
<div style="float:right">2222</div>

....

Quote:

>
I've also tried the following.
<div width="100">
<div>1111</div>

....

Quote:

>
Neither of these approaches gives me the three div's in a row. Any
hints would be appreciated!!
>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>blabla</title>
<style type="text/css">
div {float:left; border:1px solid;padding: .4em;}
</style>
</head>
<body>
<div>1111</div>
<div>2222</div>
<div>3333</div>
</body>
</html>

--
dorayme

What is Bytes?

Popular Articles