...

View Full Version : Another annoying Firefox/IE discrepancy



GOAT2G
01-09-2008, 10:00 PM
I've just finished the main template for my little web project, all using CSS, but I have a few pixels of difference when I view it in IE. I'd say there was around 2 or 3 pixels of vertical space presented in FF that are not there in IE. Those few pixles make all the different unfortunately as I am trying to match up diagonal stripes!

I've uploaded my site to:
http://download.yousendit.com/22B37B1912846BDC

I have looked around the net for various solutions but none are really relevent to my situation. I have tried a few hacks but none of them have worked. Any suggestions would be welcome. I have to hand this in for an assignment on Friday! Very last minute of me, I know.

Here's my CSS:


@charset "utf-8";
.background {
background-image: url(Files/background_tile.gif);
background-position: center;
background-repeat: repeat-y;
background-color: #333333;
}
.logoposition {
margin-top: -300px;
margin-left: -149px;
position: absolute;
left: 50%;
top: 50%;
}
.redeembutpos {
margin-top: -115px;
margin-left: -180px;
position: absolute;
left: 50%;
top: 50%;
z-index: 1;
border: 0;
}
.aboutusbutpos {
margin-top: -115px;
margin-left: -91px;
position: absolute;
left: 50%;
top: 50%;
z-index: 2;
}
.helpbutpos {
margin-top: -115px;
margin-left: -2px;
position: absolute;
left: 50%;
top: 50%;
z-index: 3;
}
.logoutbutpos {
margin-top: -115px;
margin-left: 87px;
position: absolute;
left: 50%;
top: 50%;
z-index: 4;
}
.blackboxpos {
margin-top: -54px;
margin-left: -242px;
position: absolute;
left: 50%;
top: 50%;
}
.legalboxpos {
margin-top: 218px;
margin-left: -180px;
position: absolute;
left: 50%;
top: 50%;
}
.legaltextpos {
margin-top: 230px;
margin-left: -92px;
position: absolute;
left: 50%;
top: 50%;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: lowercase;
color: #FFFFFF;
}

_Aerospace_Eng_
01-09-2008, 10:11 PM
What is up with all of the absolute positioning? Also it would be easier if you could upload your site to an actual webhost rather than having us try to download your site and rebuild it.

jcdevelopment
01-09-2008, 10:12 PM
a quick easy fix possibly, do you have




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


in your code?

GOAT2G
01-09-2008, 10:28 PM
What is up with all of the absolute positioning? Also it would be easier if you could upload your site to an actual webhost rather than having us try to download your site and rebuild it.

The absolute positioning is the best way I've found to center elements on a page both vertically and horizontally - in my limited experience.

I'm having trouble with my web host at the moment, that's the only reason I didn't give you a direct link.

I tried the padding and margin tip suggested by jcdevelopment, but that did no good.

Just to clarify, the problem seems to be with IE7 specifically. I just tried the site in IE6 and it displays fine.

:confused:

felgall
01-09-2008, 10:53 PM
Using absolute positioning to center something is doing it the hard way.

See http://www.felgall.com/cshow03.htm for the easiest way to center the content.

GOAT2G
01-09-2008, 11:59 PM
Using absolute positioning to center something is doing it the hard way.

See http://www.felgall.com/cshow03.htm for the easiest way to center the content.

I'll use that next time, thanks for your help :)

Excavator
01-10-2008, 12:10 AM
Hello GOAT2G,
I'm not seeing anything wrong in IE7 compared to FF, in spite of what the validator says:Failed validation, 209 Errors (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.yousendit.com%2Ftransfer.php%3Faction%3Ddownload%26ufid%3D22B37B1912846BDC)

Maybe you could be more specific with what's wrong?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum