Как устанавливать отдельный файл стилей для каждого браузера?

Question

[Enniack]

Например, нашел в интернетах

<script type="text/javascript">
  if(window.opera) {
  document.write('<link rel="stylesheet" type="text/css" href="style/opera.css" />');
  }
  </script>

<script type="text/javascript">
  var detect = navigator.userAgent.toLowerCase();
  if((detect.indexOf('safari')) != -1) {
  document.write('<link href="style/safari.css" rel="stylesheet" type="text/css" />');
  }
  </script>

Пробую - не работает. Есть ли еще способы для основных браузеров? И верно ли я понимаю, что для ie10+ не работают условные комментарий?

Answer 1

[qwetexac]

Попробуйте этот вариант:

function get_name_browser(){
    var ua = navigator.userAgent;    
    if (ua.search(/Chrome/) > 0) return 'Google Chrome';
    if (ua.search(/Firefox/) > 0) return 'Firefox';
    if (ua.search(/Opera/) > 0) return 'Opera';
    if (ua.search(/Safari/) > 0) return 'Safari';
    if (ua.search(/MSIE/) > 0) return 'Internet Explorer';
    return 'Не определен';
}

var browser = get_name_browser();
if (browser = 'Google Chrome') {
    var css = document.createElement("LINK");
    css.rel = "stylesheet";
    css.href = "./file.css";
    document.getElementsByTagName("HEAD")[0].appendChild(css);
};
if (browser = 'Firefox') {
    //И так далее
};

Comments

[Enniack]

Спасибо, помогли.
Только с оперой не работает, она считает себя хромом.
Ну если это так, тогда браузер и в хроме и в опере должен отображаться одинаково и мои правки для хрома = правки для оперы?

Подскажите, пожалуйста, также - не будет ли это считаться плохой практикой - кроссбраузерность таким способом?

[qwetexac]

Enniack: Не могу сказать, чего всего у меня проблемы возникали из-за того, что я не устанавливал префиксы для некоторых свойств селектора. На мой взгляд, это плохая практика, ибо если вам придется что-либо поменять на странице (например ширину блока в лучшем случае), вам придется менять все это в других файлах, которые вы подключаете. Лучше ведь, когда в одним кликом решается проблема, не правда ли?
Я всегда пользовался htmlbook.ru/css

Там в таблице показано, как тот или иной браузер реагирует на данное свойство селектора (поддерживает/нет/частично)

[Enniack]

qwetexac: Помоему, вы не туда ответили )