tarafından

display:inline-block; ile hizalama

Merhaba,

Bazı durumlarda bir #container içindeki sayısı belirli olmayan/değişebilen elementleri ortalamak isteyebilirsiniz. Bu durumda imdadınıza “display: inline-block;” yetişir. Ancak IE7 her zamanki gibi canınızı sıkacaktır. Aşağıda bu işlemin çözümünü bilmeyenler için paylaşıyorum.

CSS Kodumuz:

#container { text-align: center; zoom: 1; border: 1px solid darkgreen; width: auto; }
#container > a { display: inline-block; width: 30px; height: 10px; border: 1px solid black; }

HTML Kodumuz:

<div id=”container”>
<a href=”javascript:;”>Link 1</a>
<a href=”javascript:;”>Link 2</a>
<a href=”javascript:;”>Link 3</a>
</div>

Yukarıdaki kodları oluşturduğunuzda iki sorun ile karşılaşacaksınız.

  1. a elementleri arasındaki boşluklar kapanmayacak
  2. ie7’de inline-block çalışmayacak.

Çözüm basit. IE7 için yukarıdaki css kodlarının altına *+html #container > a { display: inline; } eklemek yeterli.

Yukarıdaki yöntem ile, sadece ie7’nin algıladığı “*+html” tanımı ile a elementinin değeri display: inline-block; ezilerek tekrar display: inline; olacak. Bu sayede elementler aynı satırda yatay olarak ortalanmış olacak. Ancak ortalanan elementler arasındaki boşluk html kodlarındaki “tab” ve “space” karakterlerinden kaynaklanmakta. Eğer onları da kaldırırsanız( örn: “<a>Bir</a><a>iki</a>” ) sorun düzelir.

Çalışan Kod: http://codepen.io/tutkun/pen/pcBvn

Kolaylıklar…

tarafından

Sublime Text 2 – CSS AutoComplete özelliğinde yeni boyut

Her Front-end Dev. en sevmediği işleri en sevilir hale getiren bir editör olan Sublime Text, kurulum sonrası içinde gelen bir python eklentisi ile göz dolduruyor. Hangi versiyonu ile geldi açıkçası bilmiyorum; ama şahane özelliklere sahip bu editörün “css_completions.py” dosyasındaki tanımlamalar işinizi çok kolaylaştıracak.

Bu dosyaya “C:\Users\PC_KULLANICI_ADI\AppData\Roaming\Sublime Text 2\Packages\CSS” adresinden erişebilirsiniz. “CTRL-SHIFT-P” kombinasyonu ile ya da “Browse Packages” seçeneği ile klasörü açabilirsiniz.

Peki bu komutlar nedir?
Dosyayı açtığınızda sizi ilgilendiren iki kısım olacak. Birincisi, “css_data” değişkeni içindeki satırlar. İkincisi, “common” içindeki satırlar.

css_data içindeki satır şöyle başlar:
“css-özellik-adı”=aldıgı-deger | veya-bu-deger | veya-bir-başka-deger

canlı örnek vermek gerekirse:
“color”=darkgreen | black
veya
“text-shadow”=1px 2px 3px #00ddff | 3px 2px 1px #ffdd00

Yani önce css özelliği, sonra aldığı parametre. Peki bu ne işimize yarayacak?
İşlem bundan sonra başlıyor! Değişken olabilecek her türlü parametreyi “$1” şeklinde(sayıyı arttırarak) tanımlıyoruz. Aslında biz “$1”, “$2”, … dediğimizde imleçleri tanımlamış oluyoruz. Aynı satırda birden fazla(“$1 test $1” gibi) tanım yaparsak, aynı anda tanımladığımız kadar imleç oluşur. ve yazdıklarımız tekrarlanır.

tarafından

Yozluğun yolundaki ilk adımlar…

Gençliğin yeni meyili/eğilimi ya da onların dilinde “trend” i; “z” yerine “s”, “k” yerine “q” gibi harfleri kullanmak v.b.! Onlar dediğime bakmayın, yabancı değil; Bizim Türk dehaları!

Ayrıca “iyi” kelimesindeki “y” harfinin başına gelenleri de sormayın.. Çünkü bazı Türk mucitler, bu harfi tedavülden kaldırmışlar. Bu vatandaşlara sorsanız, onların lügatında bu harfler yer almaz..! Muhtemelen sözlükteki yerini ve şeklini unutmuşturlar.. Ya da bizim sözlüğümüzdeki yeri ve şeklini mi deseydim?

Çocuklar/Arkadaşlar/Gençler/Yaşlılar;
Bu bir sitem! Sakın ola ki hakaret olarak algılamayın.. Ben bu tür ecnebi özentilerinin bize fayda getirdiğine hiç şahit olamadım! Zaten onlardan öyle ya da böyle bir iyiliğin, lutfedip de bizim omuzumuza dokunduğunu hiç görmedim.. Bizler tarihimize ve dilimize sahip çıkalım! 

“-Tarihini bilmeyen milletler, batmaya haktırlar!” şeklindeki uyarıyı atalarımız boşuna yapmamışlar.

“-Ee! Dilin bu sözdeki yeri nerede?” şeklindeki sorularınızı işitiyorum sanırım.. Affedin ama tarihi bilmek için de belli bir sözcük dağarcığı ve okuma yazma gerekiyor ki; Okuduğunuzu anlatabilesiniz ve de anlatabilmek için iletişim kurabilesiniz..

Bu da dil ile oluyor..

Sözü fazla uzatmaya gerek yok; Bir iki satır bizden, düşünmesi sizden..
Saygılarımla…