Web sitelerini tasarlarken birçok ayrıntıyı dikkate almamız gerekiyor. Mesela yapılan tasarımın çeşitli ekran çözünürlükleri ile uyumlu olması önemlidir. Tasarımı 1200 piksel genişlikte çizdiğinizde sitenize 1024 piksel ile giriş yapan bir ziyaretçi sayfanın tamamını göremez. Bu yüzden ya tasarımları 1000 piksel ve daha dar çizmeli ya da ufak CSS hileleri yapmalıyız.
İşte tam bu noktada yazının asıl amacına geliyoruz. Sitenin kaynak kodlarına eklenen birkaç satır kod ile farklı çözünürlüklere özgü stil dosyası çağırabiliyoruz. Örneğin aşağıdaki kod ile 1200 piksele kadar olan çözünürlüklerde dar.css dosyasını çağırırken, 1200 pikselden daha geniş çözünürlüklerde genis.css dosyasını çağırmakta. Bu yöntem sayesinde 1200 pikselden daha düşük çözünürlüklü ekranlar için özel stil dosyamızda gerekli düzenlemelerle sitenin genişliğini ayarlayabiliriz. Diğer ziyaretçiler için de genis.css dosyasını düzenlediğimizde sitemiz tüm çözünürlüklerde sorunsuz bir şekilde görüntülenecektir.
Bu yöntemi destekleyen tarayıcılar: IE 9+, Firefox 3.6+, Safari 3+, Chrome, Opera 10+
Kaynak: Farklı çözünürlükler için özel stil dosyası yapımı
