Html div yerleştirme sorunu?

SarraS · 5 Haziran 2013

site hazılarken div içine div koyuyorum ancak sitede gözükmüyor..

HTML:

<body>

<div id="header"></div>  

<div id="body">        
    <div id="userpanel"> </div>       
    <div id="content"> </div>    
    <div id="friends"> </div> 
</div> 

<div id="footer"></div>     

</body>


#header{}
#body{
     width:1024px;
     margin 0px auto;
}
#userpanel{
     width:200px;
     min-height:100px
     float:left;
}
#content{
     width:600px;
     min-height:100px
     float:left;
}
#friends{
     width:200px;
     min-height:100px
     float:left;
}

userpanel,content,friends divleri body divinin içinde olaması gerekiyor ama öğeyi denetle kısmında body div'nin yüksekliği 0 px olarak gözüküyor.. 
bu sorunu daha öncede yaşadım birşeyler yaparak düzelttim ancak şuan nedenini öğrenmek istiyorum. Yardımcı olanlara şimdiden teşekkür ederim..

zinzinzibidi · 6 Haziran 2013

Dostum,

#body yerine #container yazabilir misin?

- - - Mesaj Güncellendi - - -

<style>
#header {
}

#body {
width: 1024px;
position: relative;
margin: auto;
background-color: skyblue;
}

#userpanel {
width: 200px;
min-height: 100px;
position: relative;
float:left;
background-color: teal;
}

#content {
width: 600px;
min-height: 100px;
position: relative;
float:left;
background-color: violet;
}

#friends {
width: 200px;
min-height: 100px;
position: relative;
float:left;
background-color: goldenrod;
}
</style>

<body>

<div id="header"></div>

<div id="body">
<div id="userpanel">
<span>userpanel</span>
</div>
<div id="content">
<span>content</span>
</div>
<div id="friends">
<span>friends</span>
</div>
</div>

<div id="footer"></div>

</body>

userpanel,content,friends divleri body divinin içinde olaması gerekiyor ama öğeyi denetle kısmında body div'nin yüksekliği 0 px olarak gözüküyor..
bu sorunu daha öncede yaşadım birşeyler yaparak düzelttim ancak şuan nedenini öğrenmek istiyorum. Yardımcı olanlara şimdiden teşekkür ederim..

Tamamdır.

Eğer bir div'i ortalamak istiyorsan

position: relative;
margin: auto;

kodlarını birlikte kullan.

Ayrıca div'lerin doğru hizalanıp hizalanmadığını kontrol etmek için tasarımda bol bol arkaplan rengi kullanabilirsin.

bir div'in içinde farklı div'leri yan yana yerleştirmek istiyorsan

position: relative;
float: left;

kombinasyonunu kullanmalısın.

Şu an kodların doğru çalışıyor. Kontrol ettim. Umarım işine yarar.

Html div yerleştirme sorunu?

SarraS

Öğrenci

zinzinzibidi

Öğrenci

Benzer konular

SDN Haberleri

Son mesajlar

Forum istatistikleri

Sosyal ağlar