Help on 3-colum layout

rashid38 · #1 (**permalink**) 03-07-2008, 11:52 PM

First let me start off by saying I am new to this site and I look forward to the support.

I was wondering if anyone could tell me how to write the html code to create a 3-colum page layout with picture in the left and right colums, and text in the center colum. I have created a family website and I am trying to add the third page with this type of layout. My web page address is: http://www.arnouxalifamily.org

Thanks again,
Rashid

ssmorgan · #2 (**permalink**) 03-08-2008, 02:16 AM

Hi Rashid,

First, welcome to Website Babble.

Here are a couple of examples of a 3-column layout that I found on Lisa's 2createawebsite.com:

http://www.2createawebsite.com/templates/template1.html
http://www.2createawebsite.com/templates/template4.html

You can get the code from the links above, modify it however you like and upload it to your web host, and you're good to go!

Hope this helps.

Sherif

rashid38 · #3 (**permalink**) 03-08-2008, 08:05 AM

Sherif

The information you forward me on the 3-colum page layout. I wanted to know if that would work with picture on the left and right colums or not.

Thanks again,

Rashid

ssmorgan · #4 (**permalink**) 03-08-2008, 11:10 AM

It would definitely work.

If you insert the code for the images in the left and right columns, it will work. The only thing you would have to work on is to make sure that the width of all the images are the same and that they are as wide as the width of those columns.

Hope that makes sense. Let me know if I can help.

Sherif

James · #5 (**permalink**) 03-08-2008, 11:43 AM

rashid38

Lisa, herself, has been writing lately about the great advantage of changing to CSS for the layout instead of tables. This is much, much better and is quite easy.

In the HTML you simply enclose everything you want -- pictures, text, whatever, in a div and give it an id. In your case you could call it "leftcol," "centercol" and "rightcol" in your HTML. Then you use CSS to position it where you want.

Check out w3schools.com for easy, clear tutor for the html and css if you don't know how already. It isn't hard.

Good Success!

James

babajc · #6 (**permalink**) 04-05-2008, 03:30 PM

Quote:

Originally Posted by ssmorgan

Hi Rashid,

First, welcome to Website Babble.

Here are a couple of examples of a 3-column layout that I found on Lisa's 2createawebsite.com:

http://www.2createawebsite.com/templates/template1.html
http://www.2createawebsite.com/templates/template4.html

The main problem I see with these templates is that they don't utilize CSS (as some people mentioned later in the thread.) I'd suggest pursuing a CSS layout. It definitely allows the web search engines to much easier assess what your site is about, leading to higher rankings. Biggest added bonus is that design changes end up being a lot easier too.

Here are some 3-column templates I like:
http://www.dynamicdrive.com/style/layouts/category/C10/

lisa · #7 (**permalink**) 04-05-2008, 09:23 PM

Yeah babajc, those templates are old and I created before I knew anything about CSS but they're good for getting your feet wet. I do agree CSS is best. In fact, rashid38 I have a 3 column CSS template I made available from my site and you can customize it to add pictures in the left and right columns.

http://www.2createawebsite.com/design/cssTemplate1.zip

There are even instructions in the zip file for modifying the template. The other links the others provided will work too. W3Schools is a great site.

ydx · #8 (**permalink**) 04-07-2008, 05:43 PM

Quote:

Originally Posted by lisa

http://www.2createawebsite.com/design/cssTemplate1.zip

CSS is so versatile isn't it?!

Getting the three column via CSS is the best option.

WB Sponsors