CSS3 Renk Geçişinin <body> elemanına uygulamasındaki sorun ve çözümü
CSS3 yeniliklerinde yaralanıyoruz, tabi bazı sorunlar ortaya çıkıyor. Hatasız kod olmayacağı için, hata olur ama bir çözümüde vardır elbet diye düşünmemiz lazım.
Sorun tam olarak bir sayfanın ardalanının tamamına renk geçişi uygulamak istediğimizde belli bir yere kadar uygulayıp kalan kısmını tekrar ettirerek istemediğimiz bir durum oluşmasına neden oluyor.
Sorunun çözümünü aradığımda ilk sonuç http://stackoverflow.com/sitesinde buldum biraz daha araştırınca benzer cevaplar gördüm ve sizlerle paylaşmak istedim.
background-image özelliğine eklenen renk geçişi kodu tekrar edecektir, biz bu tekrarı istemediğimiz için.
{% highlight css %} background-repeat: no-repeat; {% endhighlight %}
ekledik. Ayrıca uygulana renk geçişinin sayfa zemininde sabitlenmesi için
{% highlight css %} background-attachment: fixed; {% endhighlight %}
kodunu ekledik.
Diğer kod eklemeleri farklı tarayıcılar içindir.
Kaynaklar
- http://stackoverflow.com/questions/2869212/css3-gradient-background-set-on-body-doesnt-stretch-but-instead-repeats
- atomicrobotdesign.com/blog/htmlcss/use-css3-gradients-to-replace-your-sites-background/
- http://www.naprej.com/css3_body_background_gradient
