need more help with free 3-column CSS template

streasure · #1 (**permalink**) 02-16-2009, 12:02 PM

Comfortable with Dreamweaver, but new to CSS. I looked on w3schools.com but was unable to figure the answer to my 2 questions below:

I am trying to customize Lisa's 3 column template for my home page and all other pages on my new website.

1) I saw from Lisa's first website review that its best to use CSS instead of tables. I am trying to set up my home page to show a 2 col x 2 row table to highlight features and special sections of the website. My ideal example is the home page of this website, http://www.hometips.com I want to show a video/image on the left/top cell and web features in the remaining cells. How can I do this in CSS?

2) Also, I want the rest of the pages with text to wrap around an image/google Ads via 'include files' as in this example, http://www.todayshouse.com/bathroom-remodeling.html. How can I do that?

Thanks for you help.

DTB · #2 (**permalink**) 02-16-2009, 12:51 PM

Hmmmmm...... There is a lot of ground to cover in this question but I'll see if I can help. I noticed on that hometips site the horizontal navigation was not done in CSS, it's a table. You can google "creating a horizontal CSS navigation" to see how to set one up for starters. Wasn't sure if you were asking how to do that too.

Since you want to change her template so much you may be better off starting from scratch. Her template is 3 column and you want 2 columns so you'll have to remove the right column (sidebar) and adjust some padding, widths, etc. if you want to keep it the same size.

The reason I say that is that I am also learning with her template and I wanted to make some big changes to it too so I started modifying things and screwed it up. But what is helping me is really learning the basics of CSS and learning how to position <div>'s. CSS is really just about positioning blocks of text using <div>s and floating them to the left, right, etc. I learned a lot by looking at Lisa's CSS code and figured out how to move things around.

I know you said you don't want to use tables but for the wrapping of google ads you can create a table with no border and align it to the left (or right) and that will make your text float around the ads.

HTML Code:

<table width="120" align="left">
<tr>
<td>
INSERT GOOGLE ADS HERE
</td>
</tr>
</table>

I don't know how to do that part with CSS. I'm still learning too.

streasure · #3 (**permalink**) 02-16-2009, 12:58 PM

Thanks for your quick reply DTB.

I definitely want a 3 column website as in www.houseandhomesense.com However, what I like about hometips.com is the Slideshow in the centre column and the ability to put other cells (it looks like a table, but I could be wrong) with my website features.

That's what I want for the index page.

But for content pages, I wanted to be able to put all the Ads (Google) at the top left of the centre column.

I thought that hometips.com was a 3 column website too though.

WB Sponsors