Autor Zpráva
RiZe
Profil
Trochu jsem očistil návštěvní knihu svého webu od tabulek a rozdělení do příspěvků dvou sloupců jsem udělal v CSS. Vše funguje dobře, až na první příspěvek, kde je hrozně velka mezera před textem. Vizte screen. http://www.cth-clan.ic.cz/chyba.jpg . Nevíte někdo čím to je?

EDIT: po odstranění prvního resetu se mezera přesune na spodní část prvního postu. V IE sloupce vůbec nejsou vedle sebe ale pod sebou, mezera se tam nevyskytuje.


<div class="item">
<div class="itemhead">
<h3 class="itemdate">#<? echo $entryCounter; ?></h3>
<h2 class="itemtitle"><a class="nodec" href="#e<? echo $postId; ?>"><? echo $postDate; ?></a></h2>
</div>

<div class="reseter"></div>

<div style="width:20%;float:left;border:1px dashed red">
<dl>
<dt><strong>Autor</strong></dt>
<dd class="ip">IP: 0.0.0.0</dd>
<dd class="ip">Email</dd>
</dl>
</div>

<div style="width:80%;padding-left:20%;border:1px dashed red">
Tady je text
</div>

<div class="reseter"></div>
</div>



.reseter {
FLOAT: none;
CLEAR: both;
}

DIV.item DIV.itemhead {
HEIGHT: 24px;
BACKGROUND: url(../images/title-empty.gif) repeat-x;
BORDER-BOTTOM: 1px solid #6e6e6e;
}

DIV.item .itemdate {
FLOAT: right;
}
peta
Profil
RiZe
google.com problemy s floatovanim v IE
jsi to nenapsal, ale hadam, ze to dela jen a pouze IE prohlizec

dej kazdemu prvku ramecek a uvidis, ze to preteka
Osobne pouzivam position na guestbook tabulku TABLE nebo odstavce P
Rellik
Profil
peta
Jestli sis nevsiml na uvedem obrazku co je to za prohlizec takje to OPERA.

RiZe
Zkus zmensit sirku toho prostredniho divu o 1% mel sem podobny problem a tim se vyresil... Sice to neni optimalni reseni a le u me fungovalo... ;)
RiZe
Profil
Jediné co je zcela evidentní (ozkoušeno), že tu mezeru dělá resetovač. Problém je v tom, že pokud tam resetovač není a text příspěvku je příliš krátký (jednořádkový), tak se výška celého boxíku přizpůsobí výšce textu příspěvku (pravý sloupec), a popisky, které jsou nalevo tak "vyčuhují" z boxíku :(
habendorf
Profil
<br class="reseter" />

.reseter {
font-size: 0;
line-height: 0.0;
height: 0;
clear: both;
}
RiZe
Profil
Tak jsem to trochu upravil. Nyní v IE funguje výborně, avšak Firefox a Opera stále velká mezera pod textem prvního příspěvku. Všechny ostatní už jsou vysoké normálně.

Screen (Opera): [url=http://www.cth-clan.ic.cz/chyba2.JPG
]http://www.cth-clan.ic.cz/chyba2.JPG
[/url]


<div class="item">
<div class="itemhead">
<h3 class="itemdate">#<? echo $entryCounter; ?></h3>
<h2 class="itemtitle"><a class="nodec" href="#e<? echo $postId; ?>"><? echo $postDate; ?></a></h2>
</div>

<div style="width:20%;float:left;">
<dl>
<dt><strong>Autor</strong></dt>
<dd class="ip">IP: 0.0.0.0</dd>
<dd class="ip">Email Web</dd>
</dl>
</div>

<div style="padding-left:20%">
Text příspěvku
</div>

<hr class="cleaner" />

</div>

hr.cleaner {
clear:both;
height:1px;
margin: -1px 0 0 0; padding:0;
border:none;
visibility: hidden;
}
DIV.item DIV.itemhead {
HEIGHT: 24px;
BACKGROUND: url(../images/title-empty.gif) repeat-x;
BORDER-BOTTOM: 1px solid #6e6e6e;
}

DIV.item .itemdate {
FLOAT: right;
}
RiZe
Profil
habendorf
Bohužel nepomáhá :'(
habendorf
Profil
To není žádná "velká mezera". Evidentně se ti to clearuje pod úroveň levého menu, takže chyba je v toršku širším kontextu, než nám tady ukazuješ.
RiZe
Profil
Je pravda, že menu jsou obě taky floatované, ale nemůže to být náhoda?

EDIT: Kecám, koukal jsem na levé menu :X
habendorf
Profil
Není to náhoda. Teď se ti to zarovnalo s pravým sloupcem (protože je delší).

EDIT: Tak jsi na to přišel sám :o)
RiZe
Profil
Koukám koukám. Tak co navrhuješ?
habendorf
Profil
Třeba dát float i střednímu sloupci.
RiZe
Profil
Hmm, je to ale prdel ladit to beztabulkově :D. Bohužel tím přijdu o dosavadní jednoduchost středního sloupce. Doteď mu stačilo padding 175px na obě strany a byl klid. Takže ohledně tohohle řešení pár otázeček.

1) Jsi jistý, že to zabere (nerad bych to celý rozházel :))
2) Jaký konkrétní float (tipuji na left)
habendorf
Profil
Takhle to máš naopak jednodušší.

.levy, .stred, .pravy {float:left;}

+ nastavit šířky
RiZe
Profil
Tak jsem to upravil (ještě mrknu na tvé řešení), ale zase jsem narazil. Střední sloupec se vykreslí až pod pravým, takže ještě trochu doladit pozici v HTML kódu ;-)

EDIT: V kódu 1. levý, 2. střední, 3. pravý sloupec. Všechny mají float: left, ale pravý sloupec zkončí úplně pod prostředním sloupcem, ale nalevo (kde je levé menu).

EDIT2: odvolávám co jsem odvolal. Jen sem tam nechal moc velký padding :X, takže teď už jen správný padding a mohlo by to běhat ;-)
habendorf
Profil
Tak máš blbě rozměry a prostě se ti vedle sebe nevejdou.
RiZe
Profil
Tak dík moc, už to funguje :)
Toto téma je uzamčeno. Odpověď nelze zaslat.