Topic awaiting preservation: simple menu (Page 1 of 1)

Hello I am new in the world of making websites and I think i have an easy question.
I already used the search but I couldnt find anything relevant.

I am making a website with a menu bar made of a table i split in 6 colums.
Each colums represents a link. And in each colum is a text linked to the right page, eg main, sales, etc.
The links work fine but what I would like to have that when a person hovers the mouse over a link/colum the background color would change.
I have searched google. The only the I could find was a css script what used a block. But when i use that one the layout is all messed up.

Could someone help me?

Thanks in advance.

Rob

Hello and welcome in the Asylum.

Since you're new to web design you should start directly with the good practices and learn why tables for layout is stupid. Then you should have a look at the Listutorial to see how to use the appropriate HTML markup and few CSS rules to design a clean,light and accessible navigation. It's really easy.

Hope that helps, enjoy your stay.

I think it would be easiest to use some style sheets along these lines:

table td a {

        display: block;

        padding: 10px 5px;

        background: white;

}

table td a:hover {

        background: red;

}

table td {

        padding: 0;

}

As you say you're just getting started with style sheets and the whole website business I'd recommend you have a look at the GurusNetwork's tutorials on (X)HTML, CSS and anything else you're interested in - a link button is at the bottom of any Asylum page here.

kuckus


[edit: I was still typing while poi replied, and he's right of course. The code I posted will help you achieve the effect you're looking for, but once you are more familiar with CSS it's a much better idea to do such a navigation bar without resorting to tables]

(Edited by kuckus on 01-24-2005 22:33)