CSS Dersleri

Tablo kolon genişliğini css ile ayarlama

Fatih Hayrioğlu

Fatih Hayrioğlu

— 1 min read

Tablolarda bazen içeriğe göre tablonun genişlemesini istemeyiz veya içeriği aşağı kaymasını engellemek isteriz. İşte çözüm hemde Gmail'den.

Google bize web hakkında örnekleri ile de yardım ediyor. Gmail'de tablo genişliğini sabitlemenin daha doğrusu metinin tablo genişliğine göre overflow:hiden uygulamasını gösteren güzel bir yöntem

{% highlight css %} .grid { table-layout: fixed; }

.grid * td { empty-cells: show; overflow: hidden; width: 100%; } {% endhighlight %}

Gmail Tablo genişliği

Güzel bir ayrıntıyı yakalamışlar. table-layout: fixed; tanımı işin püf noktası.

Kayanak: http://blog.opencomponentry.com/2007/08/22/gmail-table-column-sizing-css-fun

Read more

CSS'de lightdark() fonksiyonuyla kolayca koyu / açık mod yazımı

CSS'de lightdark() fonksiyonuyla kolayca koyu / açık mod yazımı

Bir önceki yazımda bahsettiğim gibi CSS'in yeni özelliklerinin bazıları çığır açan özellikler, bazıları kulllanıcı deneyimini iyileştirme yönünde özellikler bazıları da lightdark() fonksiyonu gibi yazım kolaylığı sağlayan özellikler. lightdark() fonksiyonu mevcut uyumlu web yazımındaki büyük sorun olan aşağıdaki kullanımı daha anlaşılır ve düzenli hale getirmeye yarıyor. :root { color-scheme: light

By Fatih Hayrioğlu