padding, height sorunu

Angelo

http://www.swiftglobal.com/tmp/pro.html

Sag taraftaki yesil linkleri alttaki yesil padin üstüne yapıştırmak istiyorum.
IE6 denen adi varlık ile Firefox farklı şeyler yapıyor.

Denediklerim

1) Firefox'da padding-top ile sag alandan yapistirmaya calistigimda, alana height verilmisse height'i itiyor asagi dogru. Padding'i uzunluga ekliyor yani. Uzunlugu kisaltirsaniz (Oranin boyutu 63 piksel, padding 40 height 23 derseniz mesela) guzel oluyor, bu sefer de IE6'de buton sigmiyor, overflow filan fayda etmiyor.

2) Bir ustteki elemente height verirseniz (header), alttakine %100 height verirseniz bu sefer Firefox itmiyor, IE itiyor.

3) Benim bildiğim bir piksel bir pikseldir, IE6 ve Firefox nasıl farklı ölçümler yapabiliyor??

Yapmayi dusunduklerim

1) Bilgisayarin monitorunu kirmak.

Borderlar daha rahat gorebilirsiniz belki diye cizilmistir.

sempaty · 11 Kasım 2008

yapmak istediğini paintte çizebilir misin

Angelo · 11 Kasım 2008

www.insiderpages.com

burada logonun sagindaki butonlara tiklandikca, asagidaki pad ile uyumlu olarak tab açıyor. bunun gibi yapmaya çalışıyorum.

container
- header
- hsol / hsag

- asagidaki pad

seklinde actim. hsol'un icindeki butonlar orada en dipte olmali ki, asagidaki padin tepesiyle cakissin. sadece firefox da veya sadece ie6'da bunu başardım. ama ikisi bir arada olmuyor.

anlatabildim mi bilmiyorum

selim61 · 11 Kasım 2008

hımm
şimdi burda 2 tane div var, 1 üst div, 2 alt div
bu ikisi için margin belirtmemişsen ikisi birbirine zaten yapışıktır.padding iç, margin dış hizalama
üstteki div seçili olup olmadığını bi id ile kontrol etmen gerekli, ve seçili ise border-bottom u alttaki div ile aynı renkte yapman gerekli.
anlatması zor ama yapması kolay, şimdi hazırlıyorum o renk düzeninde menünü

Angelo · 11 Kasım 2008

Seçili kontrolü vs yapabilirim zaten sorun orada değil, yapışsalar onu yapacağım. Yapışmıyorlar. IE6 ve Firefox varsa ne demek istediğim daha iyi anlaşılır. İkisi farklı davranış sergiliyor, biri yapıştırırken diğeri komple bölgeyi aşağı itiyor. 65 piksel uzunluğunda alan açıp kıç tarafına yerleştireceğim, bu kadar zor olmamalı, Microsoft duy sesimi.

sempaty · 11 Kasım 2008

padding-top yerine margin-top denedin mi

Angelo · 11 Kasım 2008

Olması gerektiği gibi <ul>'a döndüm.
http://likey.com/pro.html

Firefox düzgün çalıştırıyor bunu, IE'ye geçtiğinizde ne halt yediğini göreceksiniz.
Margin-top denedim fayda etmedi.

IE7'si olan varsa Firefox ile aynı şekil çalıştırıyor mu bunu?

selim61 · 11 Kasım 2008

container daki padding: 15px; i silince düzeliyor

Angelo · 11 Kasım 2008

hangi versiyonda, bende hala IE6 da butonlar kesik, overflow olmasına rağmen yarısı gösterilmiyor. ikinci verdiğim linkten bakabliirsin.

Darkart · 11 Kasım 2008

sayfanın en üstüne doctype koymayı denedinmi ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Angelo · 11 Kasım 2008

container'ın uzunluğunu kıstı. kesiklik sorunu IE da devam ediyor.

Angelo · 11 Kasım 2008

Anlayamadığım neden <ul> için margin kabul etmiyor, sağ kanada padding-top vererek butonları aşağı yapıştırmaya çalışmak zorunda kalıyorum, e bu durumda sağ kanatta yukarı bir yazı da yazamayacağım.

osahin · 11 Kasım 2008

tabmenu altından margini kaldırıp deneyebilirmisin?

osahin · 12 Kasım 2008

Hangi adresteki yapmaya çalıştığın değişmişmi bunlar anlamadım?

yagmayok · 12 Kasım 2008

Angelo şuna bakabilir misin ? Herhalde şu şekilde istiyorsun...

eRLySL · 12 Kasım 2008

CSS dosyanızdaki .hright .tab alanını şu şekilde değiştirip tekrar denermisiniz ?

Kod:

.hright .tab{
height: 63px;
padding-top: 36px;
border: 1px solid black;
vertical-align: bottom;
display:inline;
}

veya

Kod:

.hright .tab{
height: 63px;
padding-top: 36px;
border: 1px solid black;
vertical-align: bottom;
display:inline;
margin:0px;
}

Angelo · 12 Kasım 2008

Margin'i yemiyordu en baştan beri zaten.
yagmayok çok sağol: Tabla altındakinin çakışması gerekiyordu o yüzden senin örneğinde height'ı 1px uzattım. Çakıştılar. Bu seferde tabların bottom top özelliği IE'de görünmüyor, Firefox'de tablar alttaki tabmenu'nun üstüne gömülüyor biraz. Üst üste çakışmasını istememin nedeni seçili bir tab olduğunda bottom border'ı background ile aynı yapacağım klasör/tab görünümü vericek.

Angelo · 12 Kasım 2008

vertical-align'ı hiç kabul etmiyor. Tepeye çakılı kalıyor

yagmayok · 12 Kasım 2008

Tam olarak sorunu anlamadım şu şekilde bir çözüm galiba işine yarayacaktır. Ama yok olmadı diyorsan uygulamalı örnek olarak bir yere atıp gösterebilir misin, en son düzenlediğin hali ile.

style.css dosyasına

.secili {border-bottom:1px solid #BCDD5A; }

ekleyip, seçili olacak link için <a class="secili" href=""> şeklinde oluştur.

Angelo · 12 Kasım 2008

Evet ancak öyle olabilmesi için üst üste çakılı olmaları gerekiyor. Şu anda teğet durumdalar. (2px lik bir border gözüküyor Tab ile tabmenu arasında). Teğet olunca üstekkinin border'ı bg yapsan bile alttakinin border-top black gözüküyor.