webdevRefinery Forum: IE compatibility - webdevRefinery Forum

Hide message

Show message

Welcome!

Mean coders suck. Learn from nice ones.

Join up (it's free!) whether you're just starting out or you're crazy advanced. Get tips from people who know what they're talking about, without being treated like the playground smelly kid. Because seriously, your school classes didn't teach you anything you wanted to know.

Hide message

View New Content
Pick a background

Cartoon Clouds Mountains Sunrise Clouds Green Clouds None

Page 1 of 1

You cannot start a new topic
You cannot reply to this topic

Rate Topic:

mlippie

Group: Members
Posts: 76
Joined: 16-July 10
LocationSinaai, Belgium
Expertise:HTML,CSS,PHP,Javascript

Posted 06 February 2012 - 03:52 PM (#1)

IE compatibility

Need some help :)

Hi everyone,

I'm trying to get the css of my newest site to work with IE. No success so far...
Do you know any good resources where I can find info about css IE compatibility or do you have tips yourself? Cause I really want to get this right!

BTW my stylesheets work just fine in all other major browsers.

Thanks in advance!

Maxim

callumacrae

{{ post.author }}

Group: Members
Posts: 2170
Joined: 20-January 11
LocationWarwickshire, England
Expertise:HTML,CSS,PHP,Javascript,Node.js,SQL

Posted 06 February 2012 - 04:56 PM (#2)

Here!

Post some CSS that isn't working, and we'll do our best to help.

Front-end developer and writer
Twitter | GitHub | phpBB Contributor and Website Team Member | lynxphp

Daniel15

dan.cx

Group: Moderators
Posts: 3038
Joined: 17-April 10
LocationMelbourne, Australia
Expertise:HTML,CSS,PHP,Java,Javascript,SQL

Posted 06 February 2012 - 04:59 PM (#3)

IE compatibility is something you learn over time. Luckily, it's becoming less required, with IE9 being very standards compliant. IE6 and 7 are slowly fading away.

Some hints:
- Make sure you have a doctype at the top of your HTML file:

<!DOCTYPE html>

. This should always be there. Without it, browsers use "quirks mode" which makes life a nightmare.
- Try adding

zoom: 1

or a width/height to any elements that are misbehaving. This "gives the element layout". See On having layout — the concept of hasLayout in IE/Win for more info on that

Failing those, reduce your HTML / CSS down to the bare minimum required to replicate the bug. Then post that here and we can try help you

Daniel15! :D
Repeat after me: jQuery is not JavaScript. It is not the answer to every JavaScript-related question. When you have to write some JavaScript, do not instantly react with "Oh, I'll do that with jQuery!"

javascript:alert((''+[][[]])[!+[]+!+[]]+(![]+[])[+!+[]]+(''+!+[]/[])[+!+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(''+!![])[+!+[]+!![]+!![]]+(![]+[])[!+[]+!+[]]+(+!+[])+(!+[]+!+[]+!+[]+!+[]+!+[]))

Kyek, on 16 November 2011 - 11:14 AM, said:

Daniel15 is ruining my life D:

morrison_levi, on 30 September 2011 - 04:10 PM, said:

They added more features to tables because. . . oh, yeah, they do have valid uses! Ever heard of data? We do still use that. :)

arronhunt

WYSIWTF

Group: Moderators
Posts: 3165
Joined: 09-March 10
LocationLos Angeles, CA
Expertise:HTML,CSS,Graphics,Flash

Posted 06 February 2012 - 06:06 PM (#4)

A very helpful tool is Adobe's Browserlab https://browserlab.adobe.com/ it is a very convenient tool that lets you see what your site looks like on pretty much any version of IE (and other browsers as well) including different operating systems.

As far as debugging goes...your best bet is to just post each codeblock online and ask for help if you can't get it working yourself.

Professional Interface Designer, UX specialist and Frontend Developer
My Setup: 13" MBP 2011 - 2.4 GHz Intel Core i5 - 8GB DDR3 - OS X 10.8
proficient in HTML - CSS(3) - Photoshop - JavaScript - Kicking Ass

portfolio facebook | twitter | dribbble

Quote

1 sperm cell contains about 37.5MB of DNA - So a normal ejaculation transfers about 1,587GB of data in 3 seconds.

mlippie

Group: Members
Posts: 76
Joined: 16-July 10
LocationSinaai, Belgium
Expertise:HTML,CSS,PHP,Javascript

Posted 07 February 2012 - 12:03 PM (#5)

Thanks for the replies!

I'll start with the tips you gave me first...
After that I'll probably start posting some code

Daniel15

dan.cx

Group: Moderators
Posts: 3038
Joined: 17-April 10
LocationMelbourne, Australia
Expertise:HTML,CSS,PHP,Java,Javascript,SQL

Posted 07 February 2012 - 04:59 PM (#6)

The most common IE issues have quite a bit of documentation. Here's some resources I've used in the past:
http://www.positioni...t/explorer.html (has examples)
http://www.virtuosim...explorer-6-bugs

javascript:alert((''+[][[]])[!+[]+!+[]]+(![]+[])[+!+[]]+(''+!+[]/[])[+!+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(''+!![])[+!+[]+!![]+!![]]+(![]+[])[!+[]+!+[]]+(+!+[])+(!+[]+!+[]+!+[]+!+[]+!+[]))

Kyek, on 16 November 2011 - 11:14 AM, said:

Daniel15 is ruining my life D:

morrison_levi, on 30 September 2011 - 04:10 PM, said:

They added more features to tables because. . . oh, yeah, they do have valid uses! Ever heard of data? We do still use that. :)

mlippie

Group: Members
Posts: 76
Joined: 16-July 10
LocationSinaai, Belgium
Expertise:HTML,CSS,PHP,Javascript

Posted 08 February 2012 - 02:36 PM (#7)

So, question #1: doctypes.

I've read on the internet that according to the new standards my doctype should be

<!DOCTYPE html>

.
I did that but I ended up with a complete mess. I just don't know which doctype to choose...

Here's the link to the page I use for testing: Test Page.
All i'm trying to do is giving the body a width of 900 and coloring it red.

How hard can this actually be?!

Thanks in advance!
Maxim

Daniel15

dan.cx

Group: Moderators
Posts: 3038
Joined: 17-April 10
LocationMelbourne, Australia
Expertise:HTML,CSS,PHP,Java,Javascript,SQL

Posted 08 February 2012 - 05:18 PM (#8)

<!DOCTYPE html>

is the correct one. If your page ends up a mess, your HTML or CSS is wrong

I don't see any red on that page at all?

javascript:alert((''+[][[]])[!+[]+!+[]]+(![]+[])[+!+[]]+(''+!+[]/[])[+!+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(''+!![])[+!+[]+!![]+!![]]+(![]+[])[!+[]+!+[]]+(+!+[])+(!+[]+!+[]+!+[]+!+[]+!+[]))

Kyek, on 16 November 2011 - 11:14 AM, said:

Daniel15 is ruining my life D:

morrison_levi, on 30 September 2011 - 04:10 PM, said:

They added more features to tables because. . . oh, yeah, they do have valid uses! Ever heard of data? We do still use that. :)

glynnforrest

Group: Members
Posts: 116
Joined: 18-August 10
Expertise:HTML,CSS,PHP

Posted 08 February 2012 - 06:20 PM (#9)

+1 on the doctype here, and using <!DOCTYPE html>. Just solved a layout issue with one of my views in IE, all because I missed the closing '>' off the doctype. 2 hours messing about over a slow ssh connection wasted. Grrr...

About me