KODSİSTEMİ

Css ipuclari2

IE div yüksekliği sorunu

1. our_style {
2. height: 1px;
3. width: 100px;
4. background-color: black;
5. }
6. […]
7. <div class=”test”></div>

Bu kod Firefox’da sorunsuz çalışmasına karşın IE’de yükseklik 10px görünecektir. Bir bakıma IE boş içeriğin yüksekliğini 10px kabul ediyor, ancak bu bizim işimizi bozuyor. Çözüm ise çok basit.

1. .test {
2. font-size: 0
3. height: 1px;
4. width: 100px;
5. background-color: black;
6. }

Sadece font-size tanımını 0 atamamız yeterli.


//////////////////////////////////////////////////////////////////////////////////////////

Genel özellikleri bir kere tanımlayarak tekrarlardan kurtulabiliriz. Bu sitemizi hız ve tutarlılık kazandıracaktır.

Örneğin sitemizde kullanılan genel font ve font rengini body içinde tanımlayarak bir çok tekrarı engellemiş oluruz.

1. body {font:Arial, Helvetica, sans-serif; color: #474747 }

/////////////////////////////////////////////////////////////////////////////////////

Normalde tüm köşelere kenarlık(border) tanımlarken:

1. border: 1px solid #333;

kullanılır. Tek köşeye kenarlık vermek içinse:

1. border-[top-right-bottom-left]: 1px solid #333;

kullanılır. köşeye kenarlık vermek için her birini ayrı ayrı tanımlamamız gerekir.

1. border-top: 1px solid #333;
2. border-right: 1px solid #333;
3. border-left: 1px solid #333;

Bunun yerine olmayan kenarı(örn: alt kenar) görünmez yaparak hallede biliriz.

1. border: 1px solid #333;
2. border-bottom: 1px solid #fff;