Member Avatar for alexgv14

Does anybody know an easy fix for this button issue in IE 7? if you look at it in IE 7 the buttons are not aligned correctly and the rollovers don't work.

http://ryanmcmaster.com/clients/summit/

Edited by alexgv14 because: n/a
  • 2 Contributors
  • 2 Replies
  • 109 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by diafol
Member Avatar for alexgv14

Here is the CSS code for the button.

span.button a {
background:url("images/button.png") no-repeat scroll left top transparent;
float:left;
font:bold 16px/22px Arial,Helvetica,sans-serif;
margin:0;
padding:8px 0 10px 20px;
text-align:left;
text-shadow:0 1px 0 #DEEF97;
text-transform:uppercase;
width:auto;
display:inline;
color:#2d91db;
}

span.button a span.right {
padding:2px 45px 10px 0;
text-align:left;
text-shadow:0 1px 0 #DEEF97;
text-transform:uppercase;
background:url("images/button.png") no-repeat scroll right top transparent;
float:right;
height:29px;
margin:-8px -45px -9px 60px;
}

#main span.button a {
	background:url("images/button-content.png") no-repeat scroll left top transparent;
float:left;
font:bold 16px/22px Arial,Helvetica,sans-serif;
margin:0;
padding:8px 0 10px 20px;
text-align:left;
text-shadow:0 1px 0 #DEEF97;
text-transform:uppercase;
width:auto;
color:#ffffff;
}

#main span.button a:hover {
color:#ffffff !important;
}

#main span.button a span.right {
padding:2px 45px 10px 0;
text-align:left;
text-shadow:0 1px 0 #DEEF97;
text-transform:uppercase;
background:url("images/button-content.png") no-repeat scroll right top transparent;
float:right;
height:29px;
margin:-8px -45px -9px 60px;
}



#main span.button a:hover, span.button a:hover {background-position:left bottom; }
#main span.button a:hover span.right, span.button a:hover span.right {background-position:right -42px;}
Member Avatar for diafol

Took the time to check it and it looks fine to me in Chrome and IE7.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.