Solved

Code to target browser type and version? Is CSS good enough? Approaches?

Posted on 2014-10-29
9
184 Views
Last Modified: 2014-11-02
Hi;

One version of checking target browser is to add this code to the html-header. All it does is to add a class to the html-tag. The class can then be used in the css code.

Example html

<!DOCTYPE html>
<!--[if IE 7]><html class="no-js ie7 oldie" lang="en"><![endif]-->
<!--[if IE 8]><html class="no-js ie8 oldie" lang="en"><![endif]-->
<!--[if IE 9]><html class="no-js ie9" lang="en"><![endif]-->
<!--[if gt IE 9]><!--><html class="no-js" lang="sv"><!--><![endif]-->

CSS-example

.myclass{ font-size: 20px } /*Default*/
.ie8 .myclass{font-size:10px} /*Override only by ie8*/

But do you think it's robust enough? Any other approach?

Regards.
0
Comment
Question by:jazzIIIlove
  • 4
  • 4
9 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 40411332
It's pretty much what everyone uses.
0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 40411382
Yes, but is there any other approach, say more clever and more robust?
0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 40411387
E.g. does IE 10 support conditional commenting?
0
 
LVL 58

Accepted Solution

by:
Gary earned 333 total points
ID: 40411393
There are other hacks like listed here
http://css-tricks.com/snippets/css/browser-specific-hacks/

But the browser specific css is still the easiest

IE10+ dropped support for them, and there should be no need as it behaves pretty much like every other browser.
0
Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 
LVL 82

Assisted Solution

by:Dave Baldwin
Dave Baldwin earned 167 total points
ID: 40411418
I think it is generally a bad idea to write pages that need browser targeting.
0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 40411535
So this is the best way?
0
 
LVL 58

Assisted Solution

by:Gary
Gary earned 333 total points
ID: 40411542
If you have to then yes.
0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 40411543
Using css trick (assuming that the browser targeting is a solution)?
0
 
LVL 58

Expert Comment

by:Gary
ID: 40411555
As in your original question.
If it's just the odd css class then use the hacks
Or as David said fix the HTML/CSS so you don't need the hacks, unfortunately it's not always possible with the older browsers.
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Citrix XenApp, Internet Explorer 11 set to Enterprise Mode and using central hosted sites.xml file.
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now