Kodları lütfen aşağıdaki butonları kullanarak renklendirin. Örnek: <php> echo "Selam Dünya"; </php>
Yardım
karakter kaldı

divleri yan yana ve alt alta düzenli olarak yerleştirme

merhaba arkadaşlar,
derdimi başlıkta tam anlatamadım ama şu sitedeki gibi divleri yerleştirmek istiyorum.

https://pinterest.com/

float left yöntemiyle yaptığımız zaman divler farklı yükseklikte olabileceği için alt sıraya inişte boşluklar oluşuyor. burda position: absolute olarak yapılmış fakat yükseklik bilgilerini nasıl ayarlamışlar anlayamadım. bilgisi olan varsa lütfen yardım etsin. teşekkür ederim.
+0
-0
Cevaba KatılıyorumKatılmıyorum
Cevap Yaz Yorum Yaz Arşivime Ekle Takip Et

Doğru Cevap

  • xuma adlı üyenin fotoğrafı
    10 yıl önce yazılmış
    171 cevap - 1 soru
    Yanyana duran kutuların float left olarak atandığını düşünürsen hata olur.Ama her kutunun bulunuğu sutunu ele alıp kutuları onların içine yerleştirirsen aynen vermiş olduğun sitedeki bir yapı elde edersin.Yani kutularda float yok kapsayıcılara float verirsin.


    <div id="sutun1" style="float:left;">
        <div class="kutu1"></div>
        <div class="kutu2"></div>
        <div class="kutu3"></div>
    </div>
    <div id="sutun2" style="float:left;">
        <div class="kutu1"></div>
        <div class="kutu2"></div>
        <div class="kutu3"></div>
    </div>
    
    • gungnir89 adlı üyenin fotoğrafı gungnir89
      + kutuların widht'lerine sabit boyut verirsen sorun kalmaz
      10 yıl önce yazılmış
    • xuma adlı üyenin fotoğrafı xuma
      10 yıl önce yazılmış
    • bensedat18 adlı üyenin fotoğrafı bensedat18
      hocam div içeriğini mysql den döngü yoluyla çekiyorum. sizin dediğiniz şekilde evet olabilir fakat 3 veya 4 sütun halinde verileri nasıl çekecem? ben şu şekilde yapıyorum.


      <?php
      foreach ($sorgu as $sorgu)
      {
          ?>
          <div style="float:left;margin:0 10px 10px 0;">
              <img src="resim/<?php $sorgu['resim'];?>" />
          </div>
      }
      ?>
      
      10 yıl önce yazılmış
    • bensedat18 adlı üyenin fotoğrafı bensedat18
      tabi limit belirterek dediğiniz şekilde yapılabilir fakat bunu tek sorgu üzerinden yapmanın bir yolunu arıyorum ben esasında. onu son çare olarak düşünebilirim elbette.
      10 yıl önce yazılmış
    • xuma adlı üyenin fotoğrafı xuma
      Foreach sorgunundan gelecek verileri 50 farzedelim ve her sutunda 10 kutu olsun diyelim (foreach yerine for kullanacağım)

      <div>
      <?php 
      	$i=0;
      	for($j="0";$j<=40;$j++){
      		if($i%10==0){echo "</div><div class='sutun'>";}
      		echo "<div class=\"kutu\"></div>";
      		$i=$i+1;
      	}
      	echo "</div>";
      
      10 yıl önce yazılmış
    • xuma adlı üyenin fotoğrafı xuma
      Sadece resim göstereceksen alternativ js çözüm: http://tympanus.net/codrops/2011/08/30/automatic-image-montage/
      10 yıl önce yazılmış
    • bensedat18 adlı üyenin fotoğrafı bensedat18
      sizin bahsettiğiniz for döngüsü yöntemiyle fakat foreach içerisinde yaptım. tabi işin kolayına kaçmak oldu sanki bu. diğer türlüsü de kolay değil zannedersem zira position olarak yapmak için top ve left bilgisi girmek icap ediyor. bu bilgilerde javascript ile alınıyor olunsa gerek fakat neyi referans olarak almak lazım pek mantık yürütemedim. neyse teşekkür ederim hocam. saygılar.
      10 yıl önce yazılmış
    • xuma adlı üyenin fotoğrafı xuma
      For döngüsünü göstermek amacıyla kullandım senin foreach içinde kullanman doğru.
      10 yıl önce yazılmış

Cevaplar

Hiç cevap bulunamadı.