avoiding a one row table

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

David Schwartz - 07 Jul 2008 20:56 GMT

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

Reply to this Message

Ron - 07 Jul 2008 22:45 GMT

Maybe this:

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

tutorial 2 and 3 might help?

H.

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

Reply to this Message

dorayme - 08 Jul 2008 03:08 GMT

In article
<7ca7ba19-5a7b-4ebd-ae4e-28c3b7ce1429@m44g2000hsc.googlegroups.com>,

> I'm trying to learn how to use CSS rather than burdening my code with
> lots of tables.
[quoted text clipped - 6 lines]
> <div style="float:right">1111</div>
> <div style="float:right">2222</div>

...

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

...

> 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>

Signature

dorayme

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / July 2008

avoiding a one row table