Help with CSS

Immsy · 20 Mar 2010 at 18:12

Im having a few problems with the CSS on my site. It displays fine in IE but not in firefox and google chrome. I have uploaded 2 images to show whats happening.

http://www.swfbb.com/header1.JPG
http://www.swfbb.com/header2.JPG

The first image is how I want it to appear and is how IE shows the site. The second is firefox/chrome. My first thought was padding but the css im using for the menubar is

Code:

table.topnavbar {
	width: 100%;
}

tr.topnavbar {
	background-color: #CC9999;
	font-weight:bold;
	text-align: center;
}

tr.topnavbar a {
	color: #FFFFFF;
	text-decoration: none;
}

tr.topnavbar a:hover {
	color: #FFFFFF;
	text-decoration: none;
}

Can anyone shed any light on this?

Tripnologist · 20 Mar 2010 at 20:01

add cellspacing="0" to your table tag.

Immsy · 20 Mar 2010 at 20:09

Thanks, didnt realise it would be that simple

Pho · 20 Mar 2010 at 20:46

Might be worth pointing out that "cellspacing" is depreciated. You should use the border-spacing CSS property instead.

Immsy · 20 Mar 2010 at 21:24

Thanks for that advice, both do the job well so went with border-spacing

Tripnologist · 21 Mar 2010 at 00:41

Pho said:
Might be worth pointing out that "cellspacing" is depreciated. You should use the border-spacing CSS property instead.

Good to know. I rarely ever use tables.