Date: 08/07/06 (Web Development)    Keywords: css, html, web

http://www.angry-pigeon.com/oakorchard/Pages/eng_choosing01.html

I'm currently converting a web site to table-less code, and am having problems with links in Firefox. On the page I've linked to, I've made the text float to the right while the menu stays on the left, but this makes it so you cannot click on the links. It works fine in IE. Any help would be greatly appreciated. The CSS code is under the cut.


/* ---------------------General--------------------- */
* {
padding: 0;
margin: 0;
}

body {
background: #333300;
}

img {
border: none;
}

p {
font: 14px "Georgia", "Times New Roman", serif;
line-height: 20px;
}

a:link {
color: #333300;
font: 14px "Georgia", "Times New Roman", serif;
line-height: 20px;
background-color: transparent;
}

a:active {
color: white;
font: 14px "Georgia", "Times New Roman", serif;
line-height: 20px;
background: #333300;
text-decoration: none;
}

a:hover {
color: white;
font: 14px "Georgia", "Times New Roman", serif;
line-height: 20px;
background: green;
text-decoration: none;
}

h2 {
color: #000000;
font: 16px "Lucida Grande", "Arial", "Verdana", sans-serif;
font-weight: 800;
line-height: 22px;
}

h3 {
color: #000000;
font: 14px "Georgia", "Times New Roman", serif;
line-height: 20px;
}

/* ---------------------Layout--------------------- */
#container {
background: #ffffff;
margin: 15px auto;
width: 740px;
text-align: left;
position: relative;
}

#header {
}

#topMenu {
position: absolute;
top: 73px;
left: 0px;
}

#banner {
background: #ffffff;
position: absolute;
top: 91px;
text-align: center;
width: 740px;
}

#mainContent {
background: #ffffff;
width: 740px;
position: absolute;
top: 320px;
}

#contentBox {
width: 634px;
margin-left: auto;
margin-right: auto;
}

#footer {
width: 740px;
position: relative;
top: 10px;
}

#botMenu {
background: #ffffff;
position: relative;
bottom: 3px;
}

#copy {
text-align: center;
background: #333300;
position: relative;
bottom: 6px;
}

#contentLeft {
margin-right: 5px;
float: left;
}

#contentRight {
float: right;
}

/* ---------------------Properties--------------------- */
#t2, #t3, #t4, #t5, #t6 {
position: absolute;
top: 0px;
}

#t2 {
left: 116px;
}

#t3 {
left: 180px;
}

#t4 {
left: 242px;
}

#t5 {
left: 414px;
}

#t6 {
left: 608px;
}

#b2, #b3, #b4, #b5, #b6, #b7 {
position: absolute;
}

#b2 {
left: 157px;
}

#b3 {
left: 237px;
}

#b4 {
left: 332px;
}

#b5 {
left: 454px;
}

#b6 {
left: 542px;
}

#b7 {
left: 609px;
}

.h4 {
font-size: 12px;
line-height: 16px;
}

#copy p {
color: gray;
font: 10px "Arial", "Verdana", sans-serif;
line-height: 17px;
}

#footerLink {
color: gray;
font: 10px "Arial", "Verdana", sans-serif;
}

.ital {
font-style: italic;
}

Source: http://community.livejournal.com/webdev/341794.html