Web dizayn

ErenSah

Hectopat
Katılım
9 Mayıs 2021
Mesajlar
47
Daha fazla  
Cinsiyet
Erkek
Herkese merhaba. Ben yeni yeni HTML ve CSS öğreniyorum da bir sorunla karşılaştım. Yardımınıza ihtiyacım var. Görseldeki butonların alttaki turuncu yazıya değmesini ve düz yazılar yazısının alt alta değil de yan yana gelmesini istiyorum ne yapmalıyım?
Yazdığım kodlar altta. Ne eklemem lazım? Şimdiden teşekkürler.

.düz {
display: inline-block;
background: orange;
width: 70px;
color: aliceblue;
}
.düz:hover {
background-color: gray;
color: brown;
transition: all 0.45s;
}
 

Dosya Ekleri

  • resim_2022-09-06_130907418.png
    resim_2022-09-06_130907418.png
    147,5 KB · Görüntüleme: 55
Merhaba,

Öncelikle Türkçe karakter kullanmamanızı öneririm. İleride daha farklı sorunlarla karşılaşabilirsiniz.
Width'i arttırarak (tüm kutuların genişliği de artmış olacak) düz yazıları tek satır haline getirebilirsiniz.

Kolaylıklar.
 
Düz yazıların buton widthini büyüt. Butonların hepsini içine alan büyük bir div oluştur ve classın içine
CSS:
display flex;
align-items: flex-end;
ekle.
 
Yazılara width vermek yerine padding ver. Hem daha kolay hem de responsive için daha uygun olur. Width yerine padding: 8px 16px; yazmayı dene.
 

Technopat Haberler

Yeni konular

Geri
Yukarı