Обнаружение различных платформ устройств с помощью CSS

Хочу сказать, что я много читал и пробовал варианты инструкций здесь:

• http://www.cloudfour.com/ipad-css/
• Обнаружение iPhone / iPad исключительно с помощью css
• Обнаружение браузера Xoom (Android)
• http: // www .w3.org / TR / css3-mediaqueries /
• http://www.w3schools.com/html5/att_link_media.asp
• http://en.wikipedia.org/wiki/List_of_Android_devices
• http: //en.wikipedia.org/wiki/File:Vector_Video_Standards2.svg

Я хотел бы, чтобы моя страница использовала разные файлы CSS в зависимости от используемого устройства. Я видел много решений этой проблемы, и все они использовали ту или иную форму вышеперечисленного.

Однако при тестировании на HTC Desire я постоянно получаю либо вывод, предназначенный для iPad, либо полностью нефильтрованный вывод. В настоящее время мой тестовый код основан на:

http://www.cloudfour.com/ipad-css/

Вот мой HTML-файл:

    

    
    

    
    

    
    

    


    
iphone landscape
    
iphone portrait
    
ipad landscape
    
ipad portrait
    
htc desire landscape
    
htc desire portrait
    
desktop

А вот и CSS-файл ландшафта iPad (здесь я приведу только его, поскольку все они в основном одинаковы:

div
{
    display: none;
}

#ipadlandscape
{
    display: inline;
}

Я бы хотел хотелось бы знать, какие изменения необходимо внести в элементы ссылки, чтобы гарантировать, что ipad получит только свои таблицы стилей, iphone получит свои собственные и (в данном случае) htc desire (или устройства с таким же разрешением / аспектом) получит эту таблицу стилей.