Table alignment thrown off by CSS

[kizel4]

I am new with CSS, so excuse my lack of clarity.

My navigation is thrown off when I convert my text to links and use CSS to format them.

When I was initially building the site, I defined my text in the navigation using the following code:

.style10 {color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-size: 11px; }

When I converted it to links on the site, I changed my css to:

.style10 A:link {color: #FFFFFF; vertical-align: center; text-align:left; font-size: 11px; font-family: Arial, Helvetica, sans-serif; text-decoration: none}
.style10 A:visited {color: #FFFFFF; vertical-align: center; text-align:left; font-size: 11px; font-family: Arial, Helvetica, sans-serif; text-decoration: none}
.style10 A:active {color: #FFFFFF; vertical-align: center; text-align:left; font-size: 11px; font-family: Arial, Helvetica, sans-serif; text-decoration: none}
.style10 A:hover {color: #FFF666; vertical-align: center; text-align:left; font-size: 11px; font-family: Arial, Helvetica, sans-serif; text-decoration: none}

and throws off the alignment of my site.

Why does this happen? Anyway to make sure the table sizing stays the same?

Clarification: When I use the original CSS I posted and convert the text to links on the HTML, it does NOT throw off the alignment, only when I apply the new CSS.

[BoldUlysses]

A link to your page and the HTML code would be helpful, but in the meantime try this:

.style10 {font-family: Arial, Helvetica, sans-serif; font-size: 11px;}
.style10 A:link {color: #FFFFFF;}
.style10 A:visited {color: #FFFFFF;}
.style10 A:active {color: #FFFFFF;}
.style10 A:hover {color: #FFF666;}