+ Yanıtla
Sayfa Düzeni: 1 / 2
1 2 SonSon
Toplam 11 sonuçtan 1 ile 10 arası olanlar

Konu Başlığı: CSS sayfa tasarımında height=100% sorunu

  1. #1

    CSS sayfa tasarımında height=100% sorunu

    Merhabalar,

    Tablo yapısında olan bir sitem var ve bunu hem CSS öğreneyim hem de siteyi değiştireyim diyerekten değiştirmeye başladım ama bir türlü istediğim şeyi başaramadım.

    İstediğim şey ne diye sorarsanız, hemen anlatayım :

    Üstten aşağıya doğru sırası ile ustdiv, logodiv, menudiv, icerikdiv ve altdiv olacak şekilde kutularım var ve bunların hepsi alt alta dizilmeli. Bu kutulardan icerikdiv hariç hepsi sabit yükseklikte. icerikdiv ise tarayıcının boyutuna göre sayfayı doldurmalı. Nette aradım taradım, okuduklarımı uyguladım ama bir yerlerde hata yapıyorum sanırım. Kodlar yanımda olsa sizlerle paylaşacağım ama maalesef iş yerinde kaldı.

    Eğer bu anlattıklarıma göre bir yardımı dokunacak olursa benim bu gece rahat uyumamı sağlayacak

    Şimdiden teşekkürler.

    isildur - tablolardan sıkılıp CSS'ye saran insan

  2. #2

    Re: CSS sayfa tasarımında height=100% sorunu

    Anladığım kadarı ile sana bir tavsiyede bulunacağım.
    Height: 500px yaptığında sayfan 500px veya içeriğe göre uzayacakır. Yani o div içinde ne kadar uzun resim veya bilgi varsa senin içerik bölümün o kadar uzun olur. Ama sen Firefox kullanıyorsan bu böyle olmaz yani içerik kısmın 500px olur ve uzadığında da uzamaz aynı kalır. Ben bunu Explorer ve Firefox ile siteyi açtığımda görüyorum. Çözüm olarak da min-height:480px; bunu kullanıyorum. Bu kodu Explorer görmüyor ve sayfam Firefox ile de 500px den uzun olduğunda uzuyor ama 480 den aşağı inmiyor. Herneyse anlatmak zor sen bunu dene min-height:480px; çözeceksin örnek kodları ve hangi browserde bu sorun ile karşılaştığını yazarsan daha rahat yardımcı olabilirim.

  3. #3

    Re: CSS sayfa tasarımında height=100% sorunu

    Anladığım kadarı ile sana bir tavsiyede bulunacağım.


    @isildur: div'lerin maalesef öyle bir eksiği var. "position:relative" değerini verirsen sanırım problemin çözülüyor.

    HTML Kodu:
    <div style="position:relative; height:100px; background-color:#CC0000">header</div>
    <div style="position:relative; height:500px; background-color:#00CCFF">içerik</div> 
    Spoiler:
    imzaya sponsor?

  4. #4

    Re: CSS sayfa tasarımında height=100% sorunu

    kaç gündür yazıcam yazamadım, aktif ettiler hesabı sonunda :]

    Kod:
    <HTML>
    <head>
    <style type="text/CSS">
    HTML {
    width: 100%;
    height: 100%;
    }
    body {
    margin: 0px;
    }
    #myDiv {
    margin: 0px auto;
    width: 760px;
    height: 100%;
    color: #222;
    background: #ccc;
    }
    </style>
    </head>
    <body>
    <div id="myDiv">
    	boyum %100 olacak :]
    </div>
    </body>
    </HTML>
    
    bu işini görür sanırsam ama tablo kullanman tavsiyedir bu şekildeki tasarımlarda.
    bi kaç güne js ile destekli 1, 2 navigasyon örneği eklerim buraya.

    http://www.bibbox.org/boyVer.html

  5. #5

    Re: CSS sayfa tasarımında height=100% sorunu

    Arkadaşlar çok teşekkür ederim, araya başka işler girdiği için henüz bakamadım ama en kısa zamanda deneyip sonuçları sizlerle paylaşacağım.

    Kolay gelsin.

    Sevgi ve saygılarımla.

  6. #6

    Re: CSS sayfa tasarımında height=100% sorunu

    Bir de doc type ını kontrol et.

  7. #7

    Re: CSS sayfa tasarımında height=100% sorunu

    Alıntı isildur tarafından gönderilen mesaj: Mesajı Göster
    ...icerikdiv ise tarayıcının boyutuna göre sayfayı doldurmalı...
    Yukarda anlatılanlar, değişken içeriğe göre "div" uzunluğunu kontrol edecektir. Ancak istenilen tarayıcının boyutuna göre değişecek "div" uzunluğu ise, bunu JavaScript ile çözebilirsiniz.

    İçeriğe göre değişen div uzunluğu için, yukarda anlatılanlara ilave olarak;

    CSS'de height yerine min-height girin Firefox tanısın,

    <!--[if IE]>

    <![endif]-->

    arasına height girin IE de tanısın.

    IE için ek bilgi > http://www.quirksmode.org/css/condcom.html
    Biraz sarı, biraz da kırmızı...

  8. #8

    Re: CSS sayfa tasarımında height=100% sorunu

    Benzer bir sorunda ben yaşıyorum, Firefox'da divler istediğim gibi sabit yükselikte gözükürken (116px), internet Explorer'da içeriğe göre yükseklik veriyor ve görüntü bozuluyor. Max-Height komutu da işe yaramıyor. IE6 için bu divleri sabit yüksekliğe nasıl atayabilirim.

    Çalıştığım sayfa:
    http://www.sineoyun.com/sinesite/1/portal/

  9. #9

    Re: CSS sayfa tasarımında height=100% sorunu

    Benim sana daha farklı bir tavsiyem olacak.CSS ile uğraşıyorum diyosan Adobe GoLive'ı tavsiye ederim.30 günlük deneme sürümünü kullanarak yazılımı inceleyebilirsin.

    Yazılımı basitçe anlatmak gerekirse şöyle: Sen divleri görsel olarak kontrol ediyorsun.Sağa-sola, yukarı-aşağı kaydırabiliyorsun.Sen görsel olarak yönetirken CSS kodları da "Source" kısmında oluşuyor.İstersen "source" kısmından da divlere özellik ekleyebiliyorsun.

    Görsel olarak kontrol edildiğinden böyle sorunları daha az yaşarsın.

    Bu arada bu yazılım ile Wordpress temaları bile geliştirebilirsin.

  10. #10

    Re: CSS sayfa tasarımında height=100% sorunu

    Icerik verilen yukseklikten fazla yer kapliyorsa Firefox ve IE farkli davraniyor. Tasma durumu overflow ozelligi ile belirlenebiliyor. overflow:hidden; yazarsaniz problem cozulur ve 116px in disinda kalan kisim gorunmez olur. diger overflow kosullarını (scroll, visible ..) da deneyebilirsiniz ama duruma en uygunu hidden gibi gorunuyor.

+ Yanıtla
Sayfa Düzeni: 1 / 2
1 2 SonSon

Bu konu başlığı için etiketler

Mesaj Seçenekleri

  • Yeni başlık açamazsınız
  • Cevap yazabilirsiniz
  • Dosya ekleyemezsiniz
  • Mesajlarınızı değiştiremezsiniz