5 replies [Last post]
cinemaduro
cinemaduro's picture
Offline
Regular
Last seen: 12 years 45 weeks ago
Joined: 2006-12-27
Posts: 13
Points: 0

Hello world.

I'm making a roll over button with CSS instead of javascript, and it seems to work fine in IE 6 & 7, but it's only displaying half of the button in Firefox. The mouseover works, and the link works fine, it just seems like FF is reading the background image positioning wrong, and I was wondering if somone could glance at the code and clue me into what I need to do to work around this.

Many thanks to all who help.

EXAMPLE PAGE: http://www.attackyourmortgage.com/buttonTest.php

CSS:

.alphaDL {
	height: 38px;
	width: 159px;
	border-width: 0px;
	margin: 0px;
	vertical-align: middle;
}
a.buttonDL:link, a.buttonDL:visited {
	height: 40px;
	width: 161px;
	border-width: 0px;
	background-image:url(images/buttonDL.gif);
	background-repeat:no-repeat;
	background-color: #FFFFFF;
	padding: 0px;
	margin: 0px;
	background-position: 0px 0px;
	line-height: 40px;
	vertical-align: middle;
}

a.buttonDL:hover, a.buttonDL:active {
	height: 40px;
	width: 161px;
	border-width: 0px;
	background-image:url(images/buttonDL2.gif);
	background-repeat: no-repeat;
	background-color: #FFFFFF;
	padding: 0px;
	margin: 0px;
	background-position: 0px 0px;
	line-height: 40px;
	vertical-align: middle;
}

HTML:

eBook: <a class="buttonDL" href="#" rel="nofollow"> <img src="/images/alpha.gif" alt="Download Now" border="0" class="alphaDL"> </a>

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 25 weeks 6 days ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Tables? Why a table?

Tables?

Why a table?

Verschwindende wrote:
  • CSS doesn't make pies

secretsather
secretsather's picture
Offline
Regular
Last seen: 12 years 16 weeks ago
Joined: 2007-04-28
Posts: 20
Points: 0

Change both the padding

Change both the padding values to 10px

cinemaduro
cinemaduro's picture
Offline
Regular
Last seen: 12 years 45 weeks ago
Joined: 2006-12-27
Posts: 13
Points: 0

changing the padding didn't

Changing the padding worked great!! Thanks!!

As to the reason I used tables, this is part of a dynamic php shopping cart system that I'm working with. The tables are a part of that system, and I don't have the time to go in and change all the layout stuff to CSS.

cinemaduro
cinemaduro's picture
Offline
Regular
Last seen: 12 years 45 weeks ago
Joined: 2006-12-27
Posts: 13
Points: 0

hmmm...Not working in IE6

Looks like the image is getting clipped in IE6 on my bosses computer, but not mine? Weird. Anyway I'm delving into that issue now.

I'm just waiting for the day for CSS to be supported by all browsers. Web standards just aren't standards if these feakin' browsers keep going about things their own way.

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 30 weeks 2 days ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

cinemaduro wrote:I'm just

cinemaduro wrote:
I'm just waiting for the day for CSS to be supported by all browsers. Web standards just aren't standards if these feakin' browsers keep going about things their own way.

All the leading browsers today are quite compliant, actually, including, much as we despise it, IE7 whose CSS support is much better. Even IE6 is basically compliant, compliant enough so that you don't have to code especially for it if you use correct techniques of semantic html and etc. You do need a few hacks to fix it up but they are pretty well known.

But though we complain vigerously about IE (and will continue to do so) there is no excuse these days for not coding with modern best practice techniques that are well documented and robust.

Basically if you do a decent job your site can be perfectly usable in any browser. But if you are a control freak who thinks their pages must look exactly the same in every browser, which is tantamount to treating the web as paper, which it is not, then of course you'll be doomed to frustration.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.