 |
|
17.08.2006 | 14:00
| #1
İyi günler.
4–5 gündür CSS öğrenmeye çalışıyorum ve tablolu yapılardan kurtulmak için... Ekte takıldığım noktaları göstermeye çalıştım. 1.si, sol menü ve içerik (sağ taraf) aynı yükseklikte olmadığı için havada kalıyor ve aşağı tarafta beraber sonlanmıyorlar… “height: 100%” , "display:block" "float:left" (sol ve sağ kolonlar için) buna benzer yollar denedim ancak muaffak olamadım. 2.si footer bölümü için sol ve sağ menünün bitimine #footer{clear:both} yaptığımda kolonların altındaki alan kadar bir genişliğe sahip oluyor. Ben bunun yerine en altta tamamını kapsamasını istiyorum. Ancak footer için yerleştirdiğim div’in altında 5-10 px’lik bir boşluk oluşuyor. Buralardaki hatam konusunda bir fikri olan? Sitenin CSS kodları ekin içerisinde. Cevaplar için şimdiden teşekkürler… (Aramalarımda Ceyhun Aksan'ın benim sorunuma yakın bir çözümü var. Yaptığı çözümü uyguladım. Ancak yine olmadı...) Kod:
* {
margin: 0;
padding: 0;
}
body{
background:url(images/bg2.jpg) repeat-x;
background-color:#e4e4e4;
min-width:780px;
margin:0;
padding:0;
text-align:center;
}
#wrapper{
width: 760px;
margin: 20px auto 0px auto;
padding: 0px;
text-align: left;
background-color:transparent;
display:block;
}
#logo{
height: 238px;
padding: 0px;
margin: 0px;
background-color:#fffffd;
}
#solmenu{
background-color:#ffffff;
width:230px;
float:left;
margin: 3px 0px 0px 0px;
padding: 10px 10px;
display:block;
clear:left;
}
.is{
vertical-align:text-bottom;
text-align:center;
}
#content{
padding: 20px 20px;
width: 470px;
float:left;
margin:3px 0px 0px 0px;
background-color:#f5f5f5;
display: block;
clear: none;
}
#footer{
clear:both;
}
#alt{
padding:0px;
margin:0px;
background-color:#cccccc;
height: 40px;
}
|
|
| Alıntı yap |
Üyelik Tarihi: 02.08.2001
Mesaj: 1,558
|
17.08.2006 | 14:16
| #2
CSS'in belki de en sinir yaklaşımı, container'ları içeriğe eş boyutta tutması. bu height problemi için CSS camialarında çeşitli farklı yaklaşımlar var;
- JavaScript ile tüm height'leri en büyük olanına eşitlemek - görsel hileyle eşitlenmiş gibi göstermek; yani zemine 3 kolonu belirginleştiren bir imajı yukardan aşağıya uzatarak en yüksek div'in yüksekliğinde göstermek - daha 'kirli' ibr çözüm de eşitlenecek her div'in içine 1 piksel grafiği uzatarak koymak. böylece tam desteklenmeyen min-height vari bir sistem kullanmış olursun. ama bu dediğim gibi, kirli ve tercih de edilmeyen bir yöntem. |
| Alıntı yap |
|
17.08.2006 | 17:18
| #3
kolonlarla ilgili sorunun çok genel. konuyla ilgili yazilmis en iyi makale alistapart'ta. http://alistapart.com/articles/fauxcolumns/
ama senin sorununu çok daha basit bir sekilde çözebilirsin. Kod:
#wrapper{
width: 760px;
margin: 20px auto 0px auto;
padding: 0px;
text-align: left;
background-color:#fff;
display:block;
}
ikinci problemine gelince. öncelikle footer alanında yazan yazı footer div'i içerisinde durmuyor. o zaman oradaki div'in tanımlayıcı bir özelliği kalmıyor. (float sorununu halletmek için <div class="clear"> gibi bir sey koyabilirsin. altta kalan boşluk h1'in paddingi yüzünden. şöyle yaparsan sorun kalmaz. iyi çalışmalar. |
|
|
__________________
Je ne veux pas être flétri de la qualification de poseur. Je ne laisserai pas des Mémoires. La poésie n'est pas la tempête, pas plus que le cyclone. C'est un fleuve majestueux et fertile. (...) |
|
| Alıntı yap |
|
17.08.2006 | 18:50
| #4
Cevaplar için teşekkürler. Dediğiniz yollardan problemi hallettim. İyi çalışmalar...
|
|
| Alıntı yap |
|
Üyelik Tarihi: 02.08.2001
Mesaj: 1,558
|
18.08.2006 | 03:15
| #5
ilgilenenlere
http://www.paulbellows.com/getsmart/balance_columns/ adresinde ilgili js kolon boyu eşleyici script'i bulunmaktadır. |
| Alıntı yap |
Üyelik Tarihi: 29.11.2002
Mesaj: 1,166
|
18.08.2006 | 08:52
| #6
gelmiş geçmiş en iyi çözümü Alessandro Fulciniti bulmuştur
 diyeyim ...http://www.html.it/articoli/niftycube/nifty7.html http://www.html.it/articoli/niftycube/nifty8.html gibi örnekleri var. |
| Alıntı yap |
Zoque'a hoşgeldiniz!
Zoque RSS Aboneliği
