| Autor | Zpráva | ||
|---|---|---|---|
| Mufna Profil |
#1 · Zasláno: 19. 1. 2009, 17:59:00
Zdravím Vás. Mám problém s cleanerem (kupodivu jen v FF) - IE je v pohodě. Mám konstrukci používající PHP:
$i=0;
echo "\n".'<!-- Block Start -->'."\n";
echo '<div class="floatImages">'."\n";
echo '<div class="floatImages_in">'."\n";
while ($row=mysql_fetch_array($res)) {
$i++;
show_items($row);
if ($i != $num_rows) {
if ($i%3==0) {
echo '</div>'."\n";
echo '<div class="cleaner"><hr /></div>'."\n";
echo '</div>'."\n"; tady jsem zkoušel různě prohazovat ukončovací divy a clerovací div, ale nic nepomohlo
echo '<!-- Block End -->'."\n";
echo "\n".'<!-- Block Start -->'."\n";
echo '<div class="floatImages">'."\n";
echo '<div class="floatImages_in">'."\n";
}
}
}
echo '</div>'."\n";
echo '<div class="cleaner"><hr /></div>'."\n";
echo '</div>'."\n";tady jsem to taky zkoušel prohazovat
echo '<!-- Block End -->'."\n";
funkce show_items() se nachází v requirovaném souboru a část související s CSS vypadá takto:
function show_items() {
echo '<div>';
echo '<p><b>'.$row["submitter"].'</b></p>';
if (strlen($row["submitter_desc"])!=0) {
echo '<p>'.$row["submitter_desc"].'</p>';
}
foreach ($images as $image) {
if ($image!="" && file_exists($script_thumbs_dir.$image.'.jpg'))
echo '<p>'.wrt_img($script_thumbs_dir.$image.'.jpg').'</p>';
}
echo '<p>'.$row["description"].'</p>';
echo '</div>'."\n";
}
No a CSS načítané do hlavičky každé stránky vypadá takhle:
div.floatImages {
/* clear:both; */ zkoušel jsem to, nepomáhá
width:650px;
margin-top:2px;
border-top:1px solid #53254f;}
div.floatImages_in {
/* clear:both; */ zkoušel jsem to, nepomáhá
margin:10px 0 10px 0; tady je zakopaný pes, dolní margin v FF nejde, je jakoby 0
min-height:50px;kromě toho taky se nenatáhne bckgr, když je div delší, to taky nechápu
_height:50px;
background: url(../images/bg_dot_floatimgs.gif) 0 0 repeat-y;}
div.floatImages_in div {
float:left;
width:216px;}
Můžete se na to prosím někdo podívat. Už fakt nevím, kde je nějaká chyba. Myslím, že to souvisí s clearováním, ale vyzkoušel jsem snad už všechny možnosti a pořád nic. |
||
| SwimX Profil |
#2 · Zasláno: 19. 1. 2009, 18:06:38
když odstraním phpko zbyde mi cca todle:
div.floatImages {
width:650px;
margin-top:2px;
border-top:1px solid #53254f;}
div.floatImages_in {
margin:10px 0 10px 0;
_height:50px;
background: url(../images/bg_dot_floatimgs.gif) 0 0 repeat-y;}
div.floatImages_in div {
float:left;
width:216px;}
<div class="floatImages">
<div class="floatImages_in"></div>
<div class="cleaner"><hr /></div>
</div>
čeho chceeš přesně docílit? byla by ukázka? třeba div.floatImages_in div todle ničemu nenáleží. Nikde neni div uvnitř divu div.floatImages_in |
||
| Mufna Profil |
#3 · Zasláno: 19. 1. 2009, 18:13:35
SwimX
Nikde neni div uvnitř divu div.floatImages_in Je, v té funkci
function show_items() {
echo '<div>';
echo '<p><b>'.$row["submitter"].'</b></p>';
if (strlen($row["submitter_desc"])!=0) {
echo '<p>'.$row["submitter_desc"].'</p>';
}
foreach ($images as $image) {
if ($image!="" && file_exists($script_thumbs_dir.$image.'.jpg'))
echo '<p>'.wrt_img($script_thumbs_dir.$image.'.jpg').'</p>';
}
echo '<p>'.$row["description"].'</p>';
echo '</div>'."\n";
}
No, teď jsem si něco vyzkoušel, a vypadá to, že ten margin tam je. Takže možná je to spíš tak, že IE ho dělá větší, takže to budu muset ošetřit pro IE. Ale pořád mi zůstává problém, a to ten, že se nenatáhne background na celou výšku divu (pouze v FF), pokud mu nastavím min-height, tak je dlouhý jen dle této hodnoty.
div.floatImages_in {
margin:10px 0 10px 0;
min-height:50px;
_height:50px;
background: url(../images/bg_dot_floatimgs.gif) 0 0 repeat-y;}
|
||
| SwimX Profil |
#4 · Zasláno: 19. 1. 2009, 18:17:02
Mufna
„Je, v té funkci“ tak to omluva, nevšim sem si.. Takže máš x divů float" left a pod nimy div obsahující hr. Nevidím žádné css pro .cleaner. Zkus zrušit div a nechat jenom <hr style="clear: both;"> a přečíst si: http://www.pixy.cz/pixylophone/2003_12_archiv.html#1071056082 |
||
| Mufna Profil |
#5 · Zasláno: 19. 1. 2009, 18:21:08
SwimX
Nevidím žádné css pro .cleaner.
.cleaner { clear:both;
height: 0;
content: ' ';
overflow:hidden;}
.cleaner hr, .nodisplay {
display:none;}
<hr style="clear: both;"> Uvidíme, zkusím |
||
| Mufna Profil |
#6 · Zasláno: 19. 1. 2009, 18:33:33 · Upravil/a: Mufna
No, myslím, že to mám přesně tak, jak uvádí Pixy:
<div id="vnejsi-blok-s-pozadim-a-rameckem"> <div id="sloupec1-float-left">...</div> <div id="sloupec2-float-right">...</div> <hr class="cistic"> </div> Když vynechám div.floatImages (který v tomto případě nic neřeší - nekazí), tak mám: <div class="floatImages_in"></div> <div>prvni float blok</div> <div>druhy float blok</div> <div>treti float blok</div> <div class="cleaner"><hr /></div> </div> Když vynechám (ve smyslu neřeším teď) ten nešťastný cleaner, tak se mi stejně nezobrazuje background na plnou výšku rodičovského divu - resp. zobrazuje, ale jenom v IE. Tohle fakt nechápu. |
||
| Plaváček Profil |
#7 · Zasláno: 19. 1. 2009, 18:38:04 · Upravil/a: Plaváček
Mufna
Zkus nadřazenému bloku (tedy tomu, kde máš všechny plovoucí prvky) nastavit vlastnost overflow:hidden. Čili tohle by mohlo zabrat:
.floatImages_in {overflow:hidden}
Taky pomůže, když bloku .cleaner nebudeš nastavovat display:none, protože v tom případě vlastně v dokumentu neexistuje a nemůže plnit svou funkci. Lepší by asi bylo visibility:hidden. |
||
| Mufna Profil |
#8 · Zasláno: 19. 1. 2009, 18:43:52
Plaváček
pomůže, když bloku .cleaner nebudeš nastavovat display:none To není nastavený bloku, ale jen elementu hr. Funguje mi to dobře (v jiném kódu na ostatních stránkách webu nemám s cleanerem žádné problémy), jen v týhle konstrukci mi to: 1) dělá asi větší spodní margin v IE 2) nenatahuje se v FF background |
||
| Mufna Profil |
#9 · Zasláno: 19. 1. 2009, 18:46:33
Plaváček
tohle by mohlo zabrat: .floatImages_in {overflow:hidden} Vypadá to, že jo. Díky. |
||
|
Časová prodleva: 15 let
|
|||
0