Autor Zpráva
Set
Profil *
#1 · Zasláno: 2. 10. 2006, 00:41:18
Odpovědět Citovat
Dobrý den,

mám problém s tímto kusem kódu: 


<div class="odkazy">

  <div class="sloupec" style="width: 25%;">

     obsah sloupce

  </div>

  <div class="sloupec" style="width: 25%;">

     obsah sloupce

  </div>

  <div class="sloupec" style="width: 25%;">

  obsah sloupce

  </div>

  <div class="sloupec" style="width: 25%;">

  obsah sloupce

  </div>

   <hr class="cistic"> 

</div>

styly, které jsou použity jsou tyto: 


.odkazy {position:relative; padding-right:5px; margin: 5px auto; background-color:#F9F9F9; border-top:2px #B5EC93 solid; border-bottom:2px #9FD3FB solid; color:black; }   

.sloupec {float: left; position:relative;}

hr.cistic { clear: both; height: 1px; border: none; margin: -1em 0 0 0; visibility: hidden; }


Ve firefoxu se vše zobrazí jak má(4 sloupce, každý obsahuje obsah sloupce, nahoře je zelená čára, dole modrá) zatímco v ie se nezobrazí vůbec nic (ani čáry).

Pokud odstraním u .sloupec to float:left, zobrazí se to očekávatelně do jednoho sloupce, ale překvapivě to zobrazuje i v ie.

Nevíte prosím, kde je chyba?

Děkuji moc.
ash721
Profil
#2 · Zasláno: 2. 10. 2006, 20:40:50
Odpovědět Citovat
Chyba je v IE.
Pokud rodičovskému divu (.odkazy) nastavíte nějakou šířku, budete mít vyřešeno.
Set
Profil *
#3 · Zasláno: 2. 10. 2006, 21:30:09
Odpovědět Citovat
Děkuji, to pomohlo, už se zobrazuje obsah sloupců.

Objevilo se však jiné hodně podivné chování (opět jen v ie, ve ff to jede jak má): Při načtení stránky se nezobrazí pozadí pod obsahem sloupců, zobrazí se jen v části stránky, která je až na další straně. Pokud stránkou scrolluju, tak se pozadí objevuje pod textem, který se skryje, ale u prvního řádku se neobjeví nikdy. Nevíte prosím, čím by to mohlo být?


(A ještě jsou sloupce špatně široké, ale to už by až tak hrozně nevadilo)

Tady to je.

Díky.
ash721
Profil
#4 · Zasláno: 2. 10. 2006, 22:07:58
Odpovědět Citovat
Pak mě napadají dvě řešení:

1) Buďto z css odstraňte position: relative u třídy .sloupec,
nebo
2) Nastavte nějakou šířku ještě tomu seznamu <ul>
ash721
Profil
#5 · Zasláno: 2. 10. 2006, 22:15:16
Odpovědět Citovat
Ještě doplním, že i když například to position:relative tam máte zbytečně a kód je trochu krkolomný, je to stále chyba IE..
Set
Profil *
#6 · Zasláno: 2. 10. 2006, 22:41:15
Odpovědět Citovat
Tak pokud odstraním position:relative, tak to už zobrazuje v exploreru správně, ale bohužel bez toho nefunguje zarovnávání editačních prvků, které se objeví po zadání hesla (na každém řádku je "edit del +" zarovnáno do prava - pomocí a.vpravo {position:absolute; right:2px; } ), respektive všechny se sesypou na pravý okraj stránky. Existuje jiný způsob, jak je zarovnat do prava v konkrétním řádku?
ash721
Profil
#7 · Zasláno: 2. 10. 2006, 23:23:10 · Upravil/a: ash721
Odpovědět Citovat
Ano, floatováním těchto prvků (float: right;), ale pak by bylo třeba každé položce <li> nastavit pevnou výšku, nebo uvnitř (po všech floatovaných prvcích) použít ještě nějaký prvek s clear: right;. Konstrukce je pak složitější.

Nicméně:

1)
Zkuste ještě vynechat position: relative u třídy .sloupec a přidat ho naopak k položce <li>, popřípadě té konkrétní třídě. (např. .kat0)

2)
Popřípadě stále můžete nastavit tu šířku seznamu <ul>. Bezpečnější je ale zadat tuto šířku v px. (pak by to mělo vypadat stejně, ale pevná šířka zas asi není vaším cílem.) Pokud ji zadáte v procentech, bude to bohužel vypadat v obou prohlížečích jinak. Procenta jsou pro cross-browser kompatibilitu dost ošemetná.
Časová prodleva: 18 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0