On the home page i have a lightbox set up for the polaroids with specific width and height. In IE the div is exact in size but in firefox the div seems to expand beyond the dimensions of the div (a red dotted border is displayed on click)
On the Products page, the right hand side of the book has products listed in which you hover over and the polaroids will reflect different angled shots of the product that the cursor is over. Each product line is a hyperlink but in Firefox some of these lines are unlinkable whereas in IE there is no problem here! It is the same instance with the sub menu on the left hand page too
Can anyone point me in the right direction of solving these issues please?
The link is wrapping around the <canvas>, which is 401 x 401 px. The outline is standard FF behavior. You can alter it with something like this:
a {outline: transparent;}
Not sure about the other problem, though. Couldn’t see what was covering up those links, but it’s tricky code, which is always prone to browser problems. Needs someone with a better eye than mine.
One of the most tried and true, well, truisms that I’ve ever adopted was:
If it looks bad in Firefox, you’re doing it wrong.
It’s all about good web-standard browsers. Opera, Chrome, Firefox and Safari make great strides and are good choices.
IE is… well, IMO, it’s a plague. Judging a site’s functionality by whether or not it works/looks right in IE is a bad practice you might want to break the habit of. IE not only has poor DOM/CSS modeling, but utilizes a myriad of proprietary non-standards compliant tech.
It’s good that you’re on the latest version of IE (we promote a ‘You don’t have to be on a particular browser, but at least be on the latest version of it’ mentality), but I wouldn’t use IE’s success as a measure of quality.
