Css'de DIV'leri yan yana dizmek
DIV tasarımda karşılaşılan en büyük sorunlardan birisi de yaptığınız DIV'leri yan yana yerleştirmektir. Bu sorunun çözümü çok basit. Makalemizde inceleyelim.

Bu makalemizde DIV'lerimizi yan yana yerleştireceğiz.

Küçük bir not düşmekte fayda var ; Bu yan yana sıralama işleminde öncelikle bir ana div olacak ve içine yerleştireceğimiz ana divin boyutunu aşmayacak şekilde divler olacak. Örnekte daha iyi anlayacağız.

HTML Kodu:
<div id="ana_div"> <!--#Ana Div Baslangic-->
<div class="div" id="div">CSSHTMLPHP 1</div>
<div class="div" id="div2">CSSHTMLPHP 2</div>
<div class="div" id="div3">CSSHTMLPHP 3</div>
</div><!--#Ana Div Bitis-->

CSS Kodu:
#ana_div {
height: 300px;
width: 728px;
margin-right: auto;
margin-left: auto;
background-color: #666;
}
.denemediv {
float: left;
height: 200px;
width: 200px;
margin: 10px;
color: #333;
background:#eaeaea;
padding:10px;
}

Önizleme


CSSHTMLPHP 1
CSSHTMLPHP 2
CSSHTMLPHP 3

2 yorum:

  1. Adsız22 Nisan 2013 12:36

    merhaba hocam konudan biraz farkli bir sorum olucakti http://www.demotestin.blogspot.com/2013/03/piyanist.html bu adresde afisin altinda 6 tane acilir kapanir spoiler kod kutusu var,goster sakla butonlari bunlar. bunlari bir arkadas sayesinde yaptim fakat gordugunuz gibi alt alta gelmis ben ise yanyana gelmesini istiyorum. blogger icin tum denemelerimde yapamadim. yardimci olabilir misiniz

    YanıtlaSil