10 replies [Last post]
Sancho
Offline
Regular
Cape Town
Last seen: 16 years 45 weeks ago
Cape Town
Timezone: GMT+2
Joined: 2003-12-10
Posts: 13
Points: 0

Hi,
I am busy with another site, and have it displaying nicely in ie, problem is it looks crap in mozilla.
Is there someone who can help me with css hacks to get the same effect in mozilla and ie?
Thanks in advance.
The address of the site is: http://goodies.test.digiworks.co.za

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 31 weeks 19 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Help with css

For the love of Geoff. If something looks right in IE (the least standards compliant browser) but not in others, then it's a coding error, not browser error. And you don't need 'hacks', you need to validate your code and fix the errors.

Verschwindende wrote:
  • CSS doesn't make pies

Sancho
Offline
Regular
Cape Town
Last seen: 16 years 45 weeks ago
Cape Town
Timezone: GMT+2
Joined: 2003-12-10
Posts: 13
Points: 0

Help with css

The code DOES validate!!!!! (according to http://jigsaw.w3.org/css-validator/ )
What I want to do is change the css so that it looks the same in IE and Mozilla.
I have been told that the pages will display differently in the browsers because of the way they process the css.
IE apparently does not display all css correctly, and you need to use certain "CSS HACKS" to be able to get around the problem.
I was just hoping there would be someone who has some good knowledge of css, who will be able to see what it is doing in Mozilla and IE, and guide me to the changes I need to make.

Anyone?? Am I just dumb?

PS: The html validator only picks up that I am not using "alt tags".

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 14 years 9 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Help with css

Quote:
And you don't need 'hacks', you need to validate your code and fix the errors.

Or, to put it another way: Smile
You know about the two errors in html validation;
You know the css validates;
The problem is Internet Explorer is giving you what it *thinks* you meant whilst Mozilla is giving you what you actually coded.

You should get into the habit of testing your design continually in Mozilla, preferably Firefox. When it as perfect as you want, try IE and see if it is interpreting any of the code differently. Finally, throw it at Opera but don't worry too much about pixel perfection in that one.

Only then can you decide whether hacks are required and what the hacks are meant to accomplish. Then you can go searching or asking for help on a specific problem that you can describe in some detail on a relevant forum.

Suggestions:
Get Firefox, or permission from your employers to use it stand-alone.
http://www.mozilla.org/products/firefox/
Then with Firefox open, get the Web Developer Extension for Firefox.
http://www.chrispederick.com/work/firefox/webdeveloper/
Experiment with the toolbar, is that the best thing since sliced bread or what?
Now go to Outline, Block Level Elements and minutely examine the results.

Now, not a lot of people know this.
Open Internet Explorer and go to: http://www.nils.org.au/ais/web/resources/toolbar/index.html
Down load that toolbar into IE.
Now you can compare what IE makes of your code with what Firefox makes of it.

But the IE toolbar offers even more features than the Firefox one does (at the moment).

Have fun
Lorraine

Sancho
Offline
Regular
Cape Town
Last seen: 16 years 45 weeks ago
Cape Town
Timezone: GMT+2
Joined: 2003-12-10
Posts: 13
Points: 0

Help with css

Thanks Lorraine, you are a great help, and so nice!!!
Ill take your advice, and see what happens!

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 14 years 9 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Help with css

Hey, I luv you too Wink
Got family on Cape Town, summer time there, what's the weather like? If it's raining I'll gloat on my next email like they always do on theirs.

Sancho
Offline
Regular
Cape Town
Last seen: 16 years 45 weeks ago
Cape Town
Timezone: GMT+2
Joined: 2003-12-10
Posts: 13
Points: 0

Help with css

The weather is great, about 25 degrees celcius where I am, bit of a breeze but its nice and sunny anyway!
I downloaded that bar, looks awsome, playing with it now, veeeery interesting.
Smile

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 14 years 9 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Help with css

B***** :-$

DCElliott
DCElliott's picture
Offline
Leader
Halifax, Canada
Last seen: 3 years 24 weeks ago
Halifax, Canada
Timezone: GMT-3
Joined: 2004-03-22
Posts: 828
Points: 0

Help with css

As a general principle - code for the most standards-compliant browser available - Firefox 1.0 at present. When you have things working the way you want in FF then you tackle the process of applying CSS filters that feed the styles necessary for IE 5/6 to display it the same (generally) way. There are more filters for IE than there are for Gecko-based browsers (like Firefox) so it is fairly easy. The * html selector filter is one of the most common to feed styles to IE coupled with the backslash escape to select for IE5 vs IE6. A complete list of CSS filters can be found at centricle.

DE

David Elliott

Before you ask
LearnXHTML|CSS
ValidateHTML|CSS

Sancho
Offline
Regular
Cape Town
Last seen: 16 years 45 weeks ago
Cape Town
Timezone: GMT+2
Joined: 2003-12-10
Posts: 13
Points: 0

Help with css

Thanks for all the help guys,
I have got the site looking the same in both firefox and ie. The only big difference that I can see is the spacing of the links on the left, which I can live with!
Thanks again - Laughing out loud

DCElliott
DCElliott's picture
Offline
Leader
Halifax, Canada
Last seen: 3 years 24 weeks ago
Halifax, Canada
Timezone: GMT-3
Joined: 2004-03-22
Posts: 828
Points: 0

Help with css

You need to read Eric Meyer's classic discussion of lists and how to get them looking the same between browsers.

DE

David Elliott

Before you ask
LearnXHTML|CSS
ValidateHTML|CSS