Css

[mike]

Does anyone know the best way to make 3 columns in CSS?

 

And is it a good idea to use tables in CSS ?

[borfast]

The three websites I used to have as a reference for making CSS-based layouts:

 

http://www.thenoodleincident.com/tutorials...sson/boxes.html

http://glish.com/css/

http://www.bluerobot.com/web/layouts/

 

Hope it helps

 

As for using tables, using tables is fine as long as you use them for what they were made: to display tabular data. For instance, a train time-table is a set of data that should be displayed in a table. A whole webpage, using the tables as the means for laying out it's content on the screen, is not; for that, there's CSS. And that's basically it

Edited October 23, 2005 by borfast

[Deverill]

Hey Mike,

I use a lot of templates to get the general layout down and then customize from there. It's one step removed from actually learning everything about CSS positioning but gives me a great starting point and flexibility to adapt from there to what I want and to learn "a little as you go" on the CSS stuff I want to customize.

 

I'm much more motivated to learn how to do XYZZY when I need to do that for a site than just for the academic pursuit, although that's pretty high for me too

 

You can Google for things like "free CSS website templates" and find some good sites that offer a bunch of nice templates that don't look like templates... and the best thing is that with CSS it's not too hard to change the entire look in a line or two.

 

Raul's right, use tables for tabular data and they'll work great. If you go CSS I'd personally recommend that you give up tables until you get the hang of CSS and can no longer use them like a crutch like so many of us making that transition did.

[mike]

Jim,

 

That sounds like a great idea to me. I was thinking about you last nite and planned to see what you would

do. You must have read my thoughts.

 

THANKS. Thanks A LOT.

[mike]

ok

 

I have tried 3 col with header and footer css templates until I am blue in the face.

 

I found ONE that I got to work real well in IE, but looks like crap in Firefox.

 

hmmm

[TCH-Bruce]

That's strange, usually it's the other way around.

[stevevan]

Strange indeed. I've been playing with them most of the day and gotten one to look nearly identical in IE, Firefox, AND Opera.

[borfast]

Mike, you can use the code from those sites I mentioned as the basis to start building what you want. They all work (if I remember correctly) well in Firefox, IE and Opera. You just need to adjust the widths to fit your liking and then apply colors, fonts, etc, etc.

[mike]

Well I am using:

3c-hd-ft-flex-layout.css and 3c-hd-ft-flex-presentation.css ( they work together )

 

and it looks fine in ie6 but in firefox it all goes right over the footer.

 

I like firefox myself, but 95% users use ie. If I make it look good in firefox it more than

likely won't in ie

[curtis]

Mike, Try this 3 col. with header and footer layout. It works in ie6, firefox and opera.

 

http://www.cmg02.com/css/3column.htm

[mike]

Thanks, Curtis.

 

That one did work pretty well.

 

Although, I put two lines of text and one small gif file in each section, replacing what they had

and it worked perfect in IE but wouldn't find the picture in firefox.

 

Even if I remove the <pre> tags.

 

Same code - different results. Anyone know why the .gif won't show in firefox?

 

Scratch that. I just went and moved the gif into the folder the page is in and it worked.

I guess firefox wouldn't follow the path to the gif folder like ie did.

 

What's the main purpose of the <pre> tag?

[curtis]

The <pre> tag marks the text as "preformatted" -- all the spaces and carriage returns are

rendered exactly as you type them.

I used them on that page to keep the format of the code in each column instead of using a

<br /> after each line.

[mike]

so what's the difference between

 

<br> and <br /> ??

[TCH-Bruce]

 

is an HTML 4.0 specification. When you start working with XHTML every tag must have a closing tag. For tags like img, hr, br which have not closing tag the tag has been changed to add the space and / to denote the end of the tag.

 

So for a break it's

, for a horizontal rule is

---

and image is

 

Check out www.w3schools.com for more info.