IE6 Jumping Links problem

Hi

The links in my right-hand column jump upwards when I hover over them.

<div class="right-column-short">

<a class="green-button" href="apply.html">Apply for a licence</a>

<div class="link-follow" style="margin-bottom: 15px;"><a href="about.html" title="About the Licence">Find out more about a licence</a></div>
<div class="link-follow"><a href="consultations.html" title="Consultations and feedback">Give Feedback</a></div>

</div>
Click to expand...

After doing some reading online I understand that this is an IE6 bug but I haven't been able to fix it. I believe I need to change my CSS, can anyone help with where I need to change it and what I need to change it to? Many thanks

@charset "UTF-8";
/* CSS Document */

body {
font: 15px/20px lucida grande, arial, verdana;
color: #000;
}

* {
margin: 0px;
padding: 0px;
}

.clear {
clear: both;
}

.container {
width: 100%;
text-align: center;
}

.container1 {
width: 900px;
text-align: left;
margin: 0px auto;
}

.maincontent {
margin-top: 25px;
}

#header {
background: url(images/header.gif) 0px 0px repeat-x;
height: 140px;
}

#footer {
height: 170px;
text-align: center;
background: url(images/footer.gif) 0px 0px repeat-x;
}

#header .logo {
text-align: right;
padding-top: 10px;
}

/* main Navigation */

#navigation {
width: 700px;
text-align: center;
margin: 1px auto 0px auto;
}

#navigation ul {
list-style: none;
margin: 0px;
}

#navigation ul li {
float: left;
width: 133px;
text-align: center;
padding: 0px 2px;
background: none;
margin: 0px;
}

#navigation ul li a {
background: url(images/othertab.gif) 0px 0px no-repeat;
display: block;
width: 133px;
height: 42px;
line-height: 42px;
margin-top: 11px;
color: #fff;
text-decoration: none;
}

#navigation ul li a#current {
background: url(images/currenttab.gif) 0px 0px no-repeat;
display: block;
width: 133px;
color: #052F41;
height: 53px;
line-height: 53px;
margin-top: 0px;
font-weight: bold;
}

#navigation ul li a:hover {
background: url(images/currenttab.gif) 0px 0px no-repeat;
display: block;
width: 133px;
color: #052F41;
height: 53px;
line-height: 53px;
margin-top: 0px;
}

/* end navigation */

/* footer navigation */
#footer-navigation {
width: 550px;
text-decoration: center;
margin: 10px auto 0px auto;
padding: 20px 0px 0px 0px;
}

#footer-navigation ul {
margin: 0px;
}

#footer-navigation ul li {
float: left;
width: auto;
list-style: none;
background: url(images/spacer.gif) 100% 50% no-repeat;
margin: 0px;
padding: 0px;
}

#footer-navigation ul li.end {
background: none;
}

#footer-navigation ul li a, #footer-navigation ul li a:visited {
color: #fff;
text-decoration: none;
font-family: trebuchet ms;
padding: 0px 20px;
}
#footer-navigation ul li a.current {
color: #07455F;
background: #688EA5;
margin-left: -1px;
padding-left: 21px;
}

#footer-navigation ul li a:hover {
color: #07455F;
background: #688EA5;
margin-left: -1px;
padding-left: 21px;
}
/* basic styles */

p {
margin: 10px 0px 20px 0px;
}

a, a:link {
color: #07455F;
text-decoration:underline;
cursor: pointer;
}

a:visited {
color: #0A5676;
}

a:hover {
background: #07455F;
color: #fff;
text-decoration: none;
}

ul {
list-style: none;
margin-bottom: 20px;
}

ul li {
background: url(images/bullet.gif) 0px 1px no-repeat;
padding-left: 35px;
margin: 0px 0px 6px 10px;
line-height: 22px;
}

ul.nostyle li {
background: none;
padding-left: 0px;
margin: 0px 0px 6px 0px;
line-height: 20px;
}

a.red-email-button, a.red-email-button:visited, a.green-button, a.green-button:visited, a.red-button, a.red-button:visited, .red-button {
display: block;
width: 268px;
height: 50px;
background: url(images/red-button-email.gif) 0px 0px no-repeat;
text-align: center;
margin: 20px auto;
color: #fff;
font-weight: bold;
text-decoration: none;
line-height: 50px;
cursor: pointer;
}

a.red-button, a.red-button:visited, .red-button {
background: url(images/red-button.gif) 0px 0px no-repeat;
border: 0px;
}

a.green-button, a.green-button:visited {
background: url(images/green-button.gif) 0px 0px no-repeat;
}

a.red-email-button:hover {
display: block;
width: 268px;
height: 50px;
background: url(images/red-button-email.gif) 0px 0px no-repeat;
text-align: center;
margin: 20px auto;
color: #fff;
font-weight: bold;
text-decoration: none;
line-height: 50px;
}

a.green-button:hover {
display: block;
width: 268px;
height: 50px;
background: url(images/green-button.gif) 0px 0px no-repeat;
text-align: center;
margin: 20px auto;
color: #fff;
font-weight: bold;
text-decoration: none;
line-height: 50px;
}

ul.ticks li {
list-style: none;
background: url(images/tick.gif) 0px 1px no-repeat;
margin-bottom: 5px;
padding-left: 30px;
line-height: 23px;
font-size: 110%;
}

.link-follow {
padding-left: 27px;
font-weight: bold;
background: url(images/bullet.gif) 0px 0px no-repeat;
}

a img {
border: 0px;
}

.highlight {
background: #D4D8AD;
}

h1, h2, h3, h4, h5 {
font-family: trebuchet ms;
}

h2 {
font-size: 130%;
margin: 15px 0px 10px 0px;
}

.faq h2 {
margin-top: 40px;
}

h1.pageintro {
color: #000;
font-size: 190%;
line-height: 120%;
width: 750px;
text-align: center;
margin: 0px auto 20px auto;
}

.info, .question {
color: #344B54;
font-size: 170%;
background: url(images/info-header.gif) 0px 0px no-repeat;
height: 57px;
line-height: 57px;
padding-left: 70px;
margin: 20px 0px 10px 0px;
}

.question {
background: url(images/question-header.gif) 0px 0px no-repeat;
}

.info-long, .question-long, .email-long {
color: #344B54;
font-size: 170%;
background: url(images/info-header-long.gif) 0px 0px no-repeat;
height: 57px;
line-height: 57px;
padding-left: 70px;
margin: 20px 0px 10px 0px;
}

.question-long {
background: url(images/question-header-long.gif) 0px 0px no-repeat;
}

.email-long {
background: url(images/email-header-long.gif) 0px 0px no-repeat;
}

#footer h2 {
color: #CAD9DF;
font-size: 150%;
padding-top: 10px;
text-align: center;
}

.big {
color: #404040;
font-size: 110%;
}

.top-margin {
margin-top: 30px;
}

/* end basic styles */

/* 2 column pages */
.left-column {
width: 48%;
float: left;
}

.left-column-long {
width: 64%;
float: left;
}

.right-column {
width: 48%;
float: right;
}

.right-column-short {
width: 268px;
float: right;
}

/* copntact us page */
.contact-label {
width: 100px;
float: left;
font-weight: bold;
margin-bottom: 10px;

}
.contact-field {
width: 450px;
margin-bottom: 10px;
float: left;
}

/* apply page */

ul.nostyle h2 {
line-height: 27px;
margin-bottom: 5px;
}
ul.nostyle li.one, ul.nostyle li.two, ul.nostyle li.three, ul.nostyle li.four {
background: url(images/one.gif) 0px 0px no-repeat;
padding-left: 35px;
}

ul.nostyle li.two {
background: url(images/two.gif) 0px 0px no-repeat;
}

ul.nostyle li.three {
background: url(images/three.gif) 0px 0px no-repeat;
}

ul.nostyle li.four {
background: url(images/four.gif) 0px 0px no-repeat;
}

/* input boxes */
.inputbox {
border: 1px solid #ccc;
padding: 5px;
width: 400px;

}
Click to expand...

Log in or Sign up

IE6 Jumping Links problem

tinggg Active Member

Log in or Sign up

IE6 Jumping Links problem

tinggg Active Member

Useful Searches