Hi

I have a problem in making the latest versions of Internet Explorer (9) look the same as Google Chrome (26.0.1).

SUMMARY
I have two buttons one is using a class called: .linkBtn
The other button is using a class called: .buynowBtn
I have tried setting them to both be 85px wide by using "min-width:85px;"
However in MSIE both buttons are 104 pixels wide... whereas in Google Chrome although the LinkBtn is 104px, the buynowBtn is 106px!


CODE
Here are the relevant CSS lines of code:


.lot .lotDesc .linkBtn, .lot .lotDesc .linkBtnFinal{ /* (TJ-NEW) new style ".lot .lotDesc .linkBtnFinal" added for finalise button */
position:absolute;
left:8px;
bottom:0;
}
.linkBtn,.linkBtnFinal{ /* (TJ-NEW) new style ".linkBtnFinal" added for finalise button */
position:relative;
display:inline-block; /* (TJ-NEW) required to standardise button widths */
float:left;/* (TJ-NEW) required to standardise button widths */
}
.linkBtn a{
min-width:85px;
margin-bottom:3px;
}
.buynowBtn{
position:relative;
display:inline-block; /* (TJ-NEW) required to standardise button widths */
float:left; /* (TJ-NEW-180313) */
}
.buynowBtn a{
/* CSS3 Corner Radius */
-webkit-border-radius: 1em;
-moz-border-radius: 1em;
border-radius: 1em;
/* (TJ-NEW) the following has been added to standardise button widths */
min-width:85px;
display:block;
text-align:center;
}
.linkBtn a{
color:#fff!important;
font-size:12px!important;
padding:0.1em 1em; /* (TJ-NEW) ? padding adjustment previously entered had been rolled back! */
font-weight:normal;
text-decoration:none!important;
background:#BF2A48 ; /* Old browsers */
/* CSS3 Gradient Background */
background:-moz-linear-gradient(top, #BF2A48 0%, #BF2A48 49%, #9B0624 51%, #9B0624 100%); /* FF3.6+ */
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#BF2A48 ), color-stop(49%,#BF2A48 ), color-stop(51%,#9B0624), color-stop(100%,#9B0624)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #BF2A48 0%,#BF2A48 49%,#9B0624 51%,#9B0624 100%); /* Chrome10+,Safari5.1+ */
background:-o-linear-gradient(top, #BF2A48 0%,#BF2A48 49%,#9B0624 51%,#9B0624 100%); /* Opera 11.10+ */
background:-ms-linear-gradient(top, #BF2A48 0%,#BF2A48 49%,#9B0624 51%,#9B0624 100%); /* IE10+ */
background:linear-gradient(to bottom, #BF2A48 0%,#BF2A48 49%,#9B0624 51%,#9B0624 100%); /* W3C */
/*filterrogidXImageTransform.Microsoft.gradient( startColorstr='#BF2A48 ', endColorstr='#9B0624',GradientType=0 ); *//*IE6-8 */ /* (TJ-NEW) commented out IE style, as not working anyway and causes issue with fixed width */
/* CSS3 Corner Radius */
-webkit-border-radius: 1em;
-moz-border-radius: 1em;
border-radius: 1em;
/* (TJ-NEW) the following has been added to standardise button widths */
display:block;
text-align:center;
}
.linkBtn a:hover{
color:#fff;
text-decoration:none;
background: #9B0624;
}



.buynowBtn a{
color:#fff!important;
font-size:12px!important;
padding:0.1em 1em; /* ******* Updated to match place bid (TJ) ******* */
font-weight:normal;
text-decoration:none!important;
background:#888; /* Old browsers */
/* CSS3 Gradient Background */
background:-moz-linear-gradient(top, #888 0%, #888 49%, #666 51%, #666 100%); /* FF3.6+ */
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#888), color-stop(49%,#888), color-stop(51%,#666), color-stop(100%,#666)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #888 0%,#888 49%,#666 51%,#666 100%); /* Chrome10+,Safari5.1+ */
background:-o-linear-gradient(top, #888 0%,#888 49%,#666 51%,#666 100%); /* Opera 11.10+ */
background:-ms-linear-gradient(top, #888 0%,#888 49%,#666 51%,#666 100%); /* IE10+ */
background:linear-gradient(to bottom, #888 0%,#888 49%,#666 51%,#666 100%); /* W3C */
/* filterrogidXImageTransform.Microsoft.gradient( startColorstr='#888', endColorstr='#666',GradientType=0 ); *//* IE6-8 */ /* (TJ-NEW) commented out IE style, as not working anyway and causes issue with fixed width */
}
.buynowBtn a:hover{
color:#fff;
text-decoration:none;
background: #444;
}
.buynowBtn{
position:relative;
display:inline-block; /* (TJ-NEW) required to standardise button widths */
float:left; /* (TJ-NEW-180313) */
}
.buynowBtn a{
/* CSS3 Corner Radius */
-webkit-border-radius: 1em;
-moz-border-radius: 1em;
border-radius: 1em;
/* (TJ-NEW) the following has been added to standardise button widths */
min-width:85px;
display:block;
text-align:center;
}


Any thoughts?
- I tried using "width:" rather than "min-width", but the text seems to wrap onto two lines which is a disaster.

With thanks

J