[wolontariat][CSS, Wordpress] Nachodzące na siebie divy? Opcje

[unster]

Witam,
od dłuższego czasu męczę się sam z pewnym problemem w motywie na cms Wordpress.

W mojej wizji wpis wyświetlany na pojedynczej stronie składa się z jednego diva, w nim znajduje się osobny div z miniaturką, iframe z "wykopem" a całą resztę zalewa tekst. Pod tym wyżej opisanym divem, znajduje się kolejny, z różnymi bajerami...

reasumując, efekt jaki chcę uzyskać na KAŻDYM wpisie powinien wyglądać tak:
(IMG:http://iv.pl/images/z4z590vmz7yhyuz4ubk6.png)

W rzeczywistości jednak, zależnie od długości posta mam różne problemy, takie jak:
(IMG:http://iv.pl/images/lxkybc6b23gx97x3m92.png)

Jak widać poniżej, problemy "same się rozwiązują" po uzyskaniu pewnej długości/wysokości posta:
(IMG:http://iv.pl/images/yed5qg6troxzyrrb5rie.png)

Proszę o pomoc w naprawieniu ułożeniu tych divów!

Oto kod strony:

[PHP] pobierz, plaintext 
<!-- TU SIE ZACZYNA POST -->
<div>
 
<!-- miniaturki -->
<?php if ( get_post_meta($post->ID,'obrazek', true) ) { ?>
<a href="<?php the_permalink() ?>">
<img class="size-thumbnail wp-image-40 alignleft" style="border: 2px solid #e6e6e6; margin: 5px;" width="120" height="120" src="<?php bloginfo('template_url'); ?>/miniatury/phpThumb.php?src=<?php echo get_post_meta ($post->ID, "obrazek", $single = true); ?>&amp;w=120&amp;h=120&amp;zc=B"></a>
<?php } ?>			
 
<!-- wykopek -->	
<iframe class="alignright"
src="http://www.wykop.pl/widget.php?url=<?php the_permalink() ?>&title=<?php the_title(); ?>&type=normal&bold=true" 
style="border: 0px;width: 80px;height: 70px;margin: 5px;" frameborder="0" border="0">
</iframe>
 
<!-- tresc i strony -->	
<?php the_content('<p class="serif">Czytaj dalej &raquo;</p>'); ?>
<?php wp_link_pages(array('before' => '<p><strong>Strony:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?>
 
<!-- TU SIE KONCZY >> TRESC << POST'a -->
 
<!-- ramka z data i kategoria - to ta rozowa pod -->	
<div class="postmetadata alt">
<small>
Wysłano: <?php the_time('l'); ?>, <?php echo pl_date('j F, Y'); ?>, o godzinie <?php the_time() ?>. Kategoria: <?php the_category(', ') ?>.
</small>
</div>
<!-- ramka z data i kategoria - to ta rozowa pod -->
</div>
 
<p class="categories">
<?php edit_post_link('<b>Edytuj</b>', '  ', ' | '); ?>
<u>Kategoria:</u> <?php the_category(', ') ?>;
<?php the_tags('<u>Tagi:</u> ', ', ', ''); ?>
</p>
<!-- TU SIE KONCZY POST - calosc -->
[PHP] pobierz, plaintext 

jeszcze trochę css'ow:

Kod

.post {padding:5px 5px 10px 5px; width:550px; margin-bottom:10px; text-align:justify;}
.post p { padding-top:10px; line-height:140%;}
html>body .post ul { padding: 0 0 0 30px; padding-left: 10px; }
html>body .post li { margin: 7px 0 8px 10px; }
.post ul li:before { content: "\00BB \0020"; }
.post ol { padding:0; margin:0;}
.post ol li { background:#fafafa; }
.post img {margin:0 10px 10px 10px;}
.head h2 { font:normal 11px Arial; color: #999999; margin-bottom:10px; padding-left:10px; background:url(images/dot.gif) repeat-x bottom; padding-bottom:5px; }
.post h2 { display:block; background: #E6E6E6 url(images/arrow.gif) left no-repeat;padding:5px 5px 5px 25px; font:bold 14px Arial; color:#000; border-bottom:1px solid #999999;border-right:1px solid #999999;}
.post h2 a {color: #333;}
.post h2 a:hover {color: #666666;}

Kod

div.postmetadata { margin-top:10px; padding:5px; background: #F3F2ED; border:1px solid #CCCCCC; width:530px; line-height:22px; }
div.postmetadata a { border-bottom:1px dotted #666666; font-style:italic;}
div.postmetadata a:hover {background-color:#000000; color:#FFFFFF;}

z góry dziękuję za pomoc!

BlackHat.

Ten post edytował erix 19.08.2009, 13:57:50

Powód edycji: [erix] przeniosłem

[bliitz]

Spróbuj tak:

Kod

div.postmetadata { margin-top:10px; padding:5px; background: #F3F2ED; border:1px solid #CCCCCC; width:530px; line-height:22px; clear: both; }

Ten post edytował bliitz 19.08.2009, 14:21:42

[unster]

dzieki (IMG:style_emoticons/default/smile.gif)