littforneon
New Member
The links on my site (About, Gallery and Contact) overlap when you hover over them. When you have the mouse midway on the About tab the Gallery tab highlights and likewise when you have the mouse midway on the Gallery tab the Contact tab highlights. The same problem happen from the bottom tab working up.http://www.redechoevents.co.uk/\[code\]/*Logo------------------------------------------------------------ */ #logo-image { position: absolute; left: 100%; bottom: 0; width: 217px; height: 628px; z-index: 2; overflow: hidden;}#about { position: absolute; left: 0; top: 0; height: 89px; width: 336px;}span.title-link { font-size: 6.8em; font-weight: bold; font-family: 'Titillium Web', Arial, sans-serif; text-decoration: none; line-height: 93px; cursor: pointer; opacity: 0; display: inline-block !important;}span.title-link a { color: #FFF; text-decoration: none; display: inline-block !important;}.title-link a:hover { color: #E91F4C; display: inline-block !important;}#about-red { left: -104px; width: 545px;}#logo-red { height: 93px; width: 209px; position: absolute; left: 336px;} /*Echo------------------------------------------------------------ */#gallery { position: absolute; left: 0; top: 0; height: 92px; width: 434px;} #gallery-echo { left: -202px; width: 714px;}#logo-echo { height: 93px; width: 280px; position: absolute; left: 434px;} /*Events------------------------------------------------------------ */#contact-events { left: -216px; width: 862px;} #contact { position: absolute; left: 0; top: 0; height: 92px; width: 448px;} #logo-events { height: 93px; width: 414px; position: absolute; left: 448px;}\[/code\]