21. září bude sraz! Od 18.00 v restauraci Tradice v Praze u Anděla
Autor Zpráva
crater
Profil
Zdravím,
Mám malinkatý problém:

Můj layout je vytořen tak, aby se ani v mozille firefox nerozhodil.
Potřebuji použít "float:left" ale pak se stane toto co s tím?

bez "float:left" s "float:left"
---------------------------------------- ----------------------------------------
l obsah l l obsah l
l ---------- l ----------------------------------------
l l l l ----------- -----------
l l l l l l l l
l l l l l l l l
l l l l l l l l
l ---------- l l l l l
l l ----------- ------------
l ---------- l
l l l l
l l l l
l l l l
l l l l
l l l l
l ---------- l
----------------------------------------

Oba divy uvnitř obsahu jsou s "float:left" (klidně i ten pravy může mít "float:right" , ale nic to nemění).

Potřebuji mít orámování kolem obou vnitřních divů (1.příklad), ale vnitřní divy vedle sebe, jak na to?
crater
Profil
sakra!
crater
Profil
to tu nebere mezery :o(

tak jinak: základní div se neorámuje dobře s plovoucími divy, co s tím?
Martin Kuželka
Profil
Moc nechápu tvůj problém, ale zkus dát před ukončení základního divu
<div style="clear: both; font-size: 1px; line-height: 1px; height: 1px;"></div>
.
bojars
Profil
Z tých čiarok sa veľa vyčítať nedá.
Pozri na toto:

http://css.maxdesign.com.au/floatutorial/tutorial0802.htm

Můj layout je vytořen tak, aby se ani v mozille firefox nerozhodil

...alebo skús dať link na layout...
crater
Profil
Asi sem vše špatně popsal.
Zatím na tom webu pracuju a tak není žádný náhled, ale pokusím se to podrobněji vysvětlit:
- obsah webu je v divu "obsah"
- v obsahu jsou 2 divy
- oba divy jsou pod sebou a obklopuje je orámování divu "obsah"
- protože chci oba divy uvnitř "obsahu" vedle sebe, použil jsem "float:left"
(s použitím "float:right" u pravého divu se nic nezmění)
- když jsem použil tedy "float:left" u těch 2 divů, změnilo se orámování u obsahu a už tyto 2 divy neobklopuje
- jak to mám udělat, aby vnořené divy obklopovalo orámování "obsahu" ?
Acci
Profil
Na konec divu obsah umísti <span style="clear:both">&nbsp;</span>
Martin Kuželka
Profil
Moje řešení (viz. výše) to vyřeší.
bojars
Profil
crater: bolo by asi naozaj treba vidieť kód, lebo (IMHO) dva opačne floatované divy by mali byť vedľa seba. Myslím, že sa tak nestane iba v prípade:

- keď súčet ich šírok je väčší ako šírka obrazovky, treba dať pozor na rozdielne interpretácie borderov u rozdielnych browserov (použiť napr. podtržítkový hack pre IE),
- sú zle spárované tagy divov (bežne sa mi stáva, že pri prerábaní kódu na nejaký ten koncový div zabudnem),
- pri rovnako floatovaných divoch sa môže stať, že sa naskladajú nad seba ak nie je určená výška obaľovacieho divu.

Nemám dobré skúsenosti s prvotným testovaním layoutu v IE. Lepšie sa mi osvedčilo testovanie vo FF a potom dodatočné "ohackovanie" pre IE a Operu..
crater
Profil
- tak <span style="clear:both">&nbsp;</span> to řeší jen v IE nikoliv v Mozille
- znova jsem zkontroloval ukončení divů a jsou v pořádku
- výška obou divů je dána jen textem šířku mám nastavenou v css
-se šířkou vnořených divů to nemá co dělat, protože je layout automaticky rozšíří při použití širších divů
- také při použití jen jednoho vnořeného divu nsasatsane stejná záhadná situace
- vnořené divy nemají nastavený "border" jen ten obsah
- ještě: obsasah nemá taky nastavenou výšku

:-( už se s tím trápím dlouho, póóómóóóc
Martin Kuželka
Profil
A co
<span style="clear:both; display: block;">&nbsp;</span>
?
Leo
Profil
Clear: both, jak uz tady nekolikrat nekdo psat. Problem je v tom, ze floatovany obsah nenatahuje ten div na vysku - takze do nej musite strcit neco, co neni floatovane, a je to pod temi floaty, Leo
Acci
Profil
Martin Kuželka
Jo správně, musí to být blokový element, chtěl jsem napsat div, ale nějak jsem napsal span
crater
Profil
Martin Kuželka:
díky moc, <span style="clear:both; display: block;">&nbsp;</span> vše řeší, nevím jak je to možné, ale je to tak, díky díky - už můžu jít spát :-D

- ještě bych to chtěl vysvětlit?
bojars
Profil
Asi mylíš nejakú takúto stránku
tu je asi to, podstatné z CSS súboru stránky:

.obal{
width: 91%; _width: 101%;
height: 90%; _height: 70%;
padding: 1em 1em 1em 1em;
_padding-right: 2em;
margin: 2% 1% 3% 3%;
border: 2px solid Gray;
}
.sk {
width: 43%; _width: 48%;
height: 71%; _height: 90%;
padding: 2ex 2ex 2ex 2ex;
display: block;
border: 2px;
border-style: solid;
border-color: Silver;
float: left;
}
.en {
width: 43%;
_width: 48%;
height: 71%; _height: 90%;
padding: 2ex 2ex 2ex 2ex;
display: block;
border: 2px;
border-style: solid;
border-color: Silver;
float: right;
}
.pata{
clear: both;
width: 100%;
}
crater
Profil
bojars:
- řešil jsem něco jiného, děkuji...
Acci
Profil
crater
Přečti si článek jak funguje float a clear. Ten by ti to měl objasnit
crater
Profil
Acci:
díky, s float a clear jsem obeznámen, ale tuto situaci stejně nechápu, možná časem :o)
Martin Kuželka
Profil
crater: ještě bys tam měl přidat nějaké css vlastnosti (viz. můj 1. příspěvek), aby to správně fungovalo i v IE 5.
crater
Profil
Jasně, něco připravým, nech to otevřený týden :)
Toto téma je uzamčeno. Odpověď nelze zaslat.

0