Bu yolların ustasıyım firefox un hastasıyım!

Twitter’a yazdığım bi status facebook a sıçradı. Daha sonra olan oldu….

Vukuya saik olan status mesaj; (Aynı anda kaç tane dil kullanarak cümle kurdum ben bile bilmiyorum..)

İrfan : Bu yolların ustasıyım #firefox un hastasıyım!

Yuxel : kız istedim vermediler, sen opera’cısın dediler!

İrfan : Vermezler o kızı sana, #firefox hasta ona..

Yuxel : opera’ya can feda, firefox’a elveda

İrfan : Chrome bile aldı elinden şekerini, Firefox yer onun kırmızı tekerini.

(daha&helliip;)

Firefox button taginda padding ve border sorunu

Daha önce yaşadığım ve yaklaşık 30 dakikama mal olan bir problemdi bu. Aynı problemle bir başka projede tekrar karşılaştım, not almak gerekliymiş demekki -)

Button tag’ını severim kullanırım. Button tagı sayesinde;

  • input[type="submit"] gibi css atraksyonlarına gerek kalmaz.
  • button{} selector’ü input[type="submit"]{}
    selector’ünden daha hızlıdır.
  • Form’larda post/reset gibi event’lar için kullanılabilir.
  • Tag içerisinde html kullanılabilir.
  • Projenin tamamında kullanılacak buton görselleri tek etiket ile şekillendirilir.
  • Daha kolay bir regex ile tüm buton taglarını grep’leyebiliriz.
    • Button tag’ını grep’lemek için;
      $ grep -rHn '<button.*>' *
    • Input butonları grep’lemek için;
      $ grep -rHn '<input.*type=\"submit\".*' *

Firefox button tagına padding ve border -input button a da- uyguluyor. Chrome, Safari, Opera gibi tarayıcılarda bu tür bir problem ile karşılaşmadım.

Çözüm;

button::-moz-focus-inner {
border: 0;
padding: 0;
}

Şöyle ecnebice kaynaklarda var;

http://forum.userstyles.org/comments.php?DiscussionID=2773
http://www.aheadcreative.com/removing-unwanted-button-padding-in-firefox/
http://stackoverflow.com/questions/1433232/moz-focus-inner

Opera ve Firefox’da body’e background bottom çalışmıyor mu ?

Evet az önce keşfettim bende. Bunca yıldır nasılda hiç başıma gelmedi çok şaşırdım.. Firefox, Opera ve diğer bazı tarayıcılarda yaşayabileceğiniz bir problem.

html body{
	background-image: url('/img/bg.jpg');
	background-position: bottom right;
}

Şeklinde kullandığınız css çalışmıyorsa bir satır daha (background-attachment:fixed;) ekleyin, css aşağıdaki gibi olsun.

html body{
	background-image: url('/img/bg.jpg');
	background-position: bottom right;
	background-attachment:fixed;
}

Hepsi bu