/    Sign up×
Community /Pin to ProfileBookmark

Browser compatibility

Up until now I have been learning Javascript, HTML, CSS, ASP, SQL etc.. and testing it on only an IE browser. I want to start developing pages though for IE, Netscape and Firefox mainly.

In terms of using HTML, CSS and Javascript can anyone direct me to help or documentation which describes what the best methods are that will make it as easy as possible to be cross browser compatible? I am interested in things such as making menus, layers, links etc… to work on at least those browsers. I have tried searching google and these forums but am probably not using the right search terms to get the information I want.

I appreciate any help in advance,
Thank you.

to post a comment
Full-stack Developer

9 Comments(s)

Copy linkTweet thisAlerts:
@soccer362001Feb 09.2005 — Cross browser compatibility is quite difficult. I often find that it is easier to develope the site in FireFox, then go back with CSS hacks, and make it look right in Internet Explorer, or visa versa.
Copy linkTweet thisAlerts:
@ai3rulesauthorFeb 09.2005 — what exactly are css hacks?
Copy linkTweet thisAlerts:
@soccer362001Feb 09.2005 — CSS hacks are used when something looks ok in one browser, but not in another. For example if your site looked ok in FF and not in IE you would use a hack similar to this html*#div{} rather than #div{}
Copy linkTweet thisAlerts:
@the_treeFeb 09.2005 — The best way is just to download all the browsers that you want to check it in.

Checking that your css and your markup are both valid makes it more likely that your site will be consistent through different browsers but it doesn't make any garuntees.
Copy linkTweet thisAlerts:
@ai3rulesauthorFeb 09.2005 — I don't really understand the css hacks concept, yet. I noticed, from looking at many posts, that using CSS for navigational menus and webpage structure is preferred (correct me if I'm wrong). Are there any good tutorials out there that I can brush up on - I plan on re-designing my pages so that they are mostly formatted using CSS.

Thanks again in advance for your help.
Copy linkTweet thisAlerts:
@toicontienFeb 09.2005 — Cross browser compatibility can be achieved when writing standard HTML and CSS, though it isn't guaranteed like soccer362001 mentioned above. The proper term for CSS hacks is actually CSS filters. Basically you write valid CSS that takes advantage of parsing errors in certain browsers so some styles get hidden.

soccer362001, you had a slight case of lysdexia with the IE-Win hack (filter) you wrote above ?
<i>
</i>* html #someID { /* Styles for IE-Win only */ }


If you're just starting out with CSS, go to www.w3schools.com and read up on CSS there. It also never hurts to look up [url=http://www.w3.org/TR/CSS21/]CSS 2.1[/url] at the World Wide Web Consortium, seeing as that's the group that standardized CSS.

When it actually comes time to apply what you've learned and create layouts, my favorite site has always been [url=http://www.alistapart.com/]A List Apart[/url].

Download the latest versions of Opera, Firefox, Netscape, and Internet Explorer. Go to http://www.skyzyx.com/archives/000094.php to find out how to install multiple versions of IE on one installation of Windows without affecting the Windows registry. It's easy.

Design first in Firefox. It's based on the Gecko Runtime Environment, which is the most standards compliant browser rendering engine. Use various CSS filters to get the design to work in IE-Win and IE5-Mac. For more specific questions, drop by the [url=http://www.webdeveloper.com/forum/forumdisplay.php?s=&forumid=7]CSS[/url] Forum here.
Copy linkTweet thisAlerts:
@ai3rulesauthorFeb 09.2005 — Thanks for your reply, it looks like more than enough resources lol. I will check them out in a bit when I am done with work.

Thanks again.
Copy linkTweet thisAlerts:
@soccer362001Feb 09.2005 — [i]Originally posted by toicontien [/i]

[B]



soccer362001, you had a slight case of lysdexia with the IE-Win hack (filter) you wrote above ?

<i>
</i>* html #someID { /* Styles for IE-Win only */ }


[/B][/QUOTE]

Hmm... html*#div works fine for me.
Copy linkTweet thisAlerts:
@toicontienFeb 10.2005 — I see what you mean now. I thought you were writing the Holly hack :p
×

Success!

Help @ai3rules spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...