CSS ile yan yana gelen divler arasına boşluk nasıl verilir?

Web sayfalarında yan yana dizilen divler arasına boşluk eklemek, CSS'nin margin ve gap özellikleri ile kolayca yapılabilir. Bu yöntemler, içeriklerin düzenli görünmesini sağlarken, estetik bir deneyim sunar.

İçindekiler Göster

CSS ile yan yana gelen divler arasına boşluk nasıl verilir?

Yan yana yerleştirilen divler arasında boşluk oluşturmak, web tasarımında estetik ve işlevsellik açısından önemli bir detaydır. Bu boşluk, içeriklerin daha düzenli görünmesini sağlarken, kullanıcı deneyimini de iyileştirir. CSS kullanarak bu boşlukları çeşitli yöntemlerle ayarlamak mümkündür. Özellikle margin ve gap özellikleri, tasarımcıların işini kolaylaştırır ve esnek düzenlemeler yapmalarına olanak tanır.

CSS ile yan yana gelen divler arasına boşluk bırakmak için 

margin
özelliği kullanılabilir.

Bazı kullanım örnekleri:

  • Her taraftan eşit boşluk bırakmak için: 
    margin: 50px;
    .
  • Sadece sağ taraftan boşluk bırakmak için: 
    margin-right: 5px;
    veya 
    margin: 0 5px 0 0;
    .

Ayrıca, 

gap
özelliği de kullanılabilir, bu özellik flex (esnek) düzen içinde divler arasında boşluk bırakmak için uygundur.

Örnek kod:

.kutu {
  width: 100px;
  height: 100px;
  background-color: #D33257;
  float: left;
  margin: 50px;
}

Bu örnekte, her nesnenin kendine ait 50 piksellik boşluğu olduğu için iki nesne arasında 50 + 50 olacak şekilde 100 piksel boşluk oluşur.

Diğer Teknoloji Yazıları

CSS ile navbar yapımı nasıl yapılır?

CSS ile şık bir navigasyon çubuğu oluşturmak, web tasarımının önemli bir parçasıdır. Bu süreç, kullanıcıların sitenizde rahatça gezinebilmesi için gerekli olan temel yapının oluşturulmasını içerir. HTML ile basit bir yapı kurduktan sonra, CSS ile bu...

CSS gruplama nasıl yapılır?

CSS'de gruplama, benzer stil kurallarını bir arada tutarak kodunuzu daha düzenli ve okunabilir hale getirmek için oldukça kullanışlı bir tekniktir. Bu yöntem, birden fazla HTML etiketine aynı stil ayarlarını uygulamak istediğinizde devreye girer. Böylece, her...

CSS kod düzenleyici hangisi?

Web geliştirme sürecinde CSS kodlarını düzenlemek için kullanılan araçlar, geliştiricilerin verimliliğini artırmakta büyük rol oynamaktadır. Bu editörler, kullanıcı dostu arayüzleri ve sundukları çeşitli özelliklerle, kod yazmayı daha kolay ve hızlı hale getirir. Birçok farklı seçenek...

CSV dosyasında ; yerine ne kullanılır?

CSV dosyaları, verilerin sistematik bir şekilde düzenlenmesi için yaygın olarak kullanılan bir formattır. Ancak, bu dosyaların doğru şekilde okunabilmesi ve işlenebilmesi için belirli kurallara uyulması gerekmektedir. Özellikle alanları ayıran karakterin seçimi, verilerin düzgün bir şekilde...
Teknoloji