"li" che "non si fa spazio"

[mystica]

salve
ho un loop di post strutturati in una lista
ora ho fatto in modo di attribuire al primo post un div diverso da tutti gli altri seguenti
tuttavia, questo div non fa altro che sovrapporsi agli altri elementi della lista
c'è un modo per dire a questo div che deve "farsi spazio" e allontanare gli altri "li"?
ecco il link http://www.eiegroup.it/thepastpost/
ho provato con il position, ma non funziona
e neanche col clear
grazie!

[Mich_]

.latestarticle e .article sono su due piani differenti: uno ha posizionamento relativo, gli altri hanno float.
Con un layout di quel tipo, mi aspetterei che .latestarticle avesse tutte le proprieta` che hanno anche .article, con la larghezza cambiata e in piu` qualche altra cosa.

[mystica]

grazie per la risposta
ecco il css

.latestarticle {
border: 5px solid #999;
width:695px;
position: relative;
/*background-color:#ffffff;*/
padding:7px;
overflow:hidden;

.article {float: left;
width:219px;
background-color:transparent;
padding:10px;
border-top:solid 1px #e7e7e7;
}

[RoTeam]

Sbaglio o non chiudi .latestarticle?

[Mich_]

Quello lo avevo visto. E in base a quello avevo dato la mia risposta.

In pratica ti consigliavo di fare qualcosa del tipo:

.article {
  float: left;
  width:219px;
  background-color:transparent;
  padding:10px;
  border-top:solid 1px #e7e7e7;
}
.latestarticle {
  float: left;
  border: 5px solid #999;
  width:695px;
  padding:7px;
  overflow:hidden;
}

Nota pero` che la larghezza totale di .article e` di 241px, mentre quella di .latestarticle e` di 719px (la soluzione migliore e` che la larghezza sia un multiplo esatto dell'altra)

[mystica]

latestarticle è chiuso, ho sbagliato a copiare e incollare
mich_, ho provato ma niente, si sovrappone sempre
secondo me perchè il loop crea una lista e il primo post rimane "intrappolato" nella lista stessa

[Mich_]

No. non ha senso quello che dici.

Quello che tu chiami loop e` un loop del tuo codice lato server (forse PHP), che pero` non compare come tale nel browser, dove compaiono i singoli[*] ripetuti.
Per sincerartene vedi il codice HTML nel browser (click destro fuori dalle immagini e visualizza sorgente)

Tieni pero` presente che io ho guardato solo il codice dei due blocchi specificati, mentre il CSS e` molto complesso e organizzato in modo "non-umano" (cioe` la successione dei blocchi non segue una logica facilmente intuibile), per cui non e` facile capire se ci sono altri posti dove viene formattato qualche blocco. Forse tu hai la pazienza di sistemare il CSS e capire se ci sono altre formattazioni.

[mystica]

ok, grazie ancora
il codice (è wordpress) è questo

<ul class="mcol">
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>

<?php if (is_paged()) : ?>
<?php $postclass = ('article'); ?>
<?php else : ?>
<?php $postclass = ($post == $posts[0]) ? 'latestarticle' : 'article'; ?>
<?php endif; ?>
<li class="<?php echo $postclass ?>">

<?php
if ( has_post_thumbnail() ) { ?>
<?php
$imgsrcparam = array(
'alt' => trim(strip_tags( $post->post_excerpt )),
'title' => trim(strip_tags( $post->post_title )),
);
$thumbID = get_the_post_thumbnail( $post->ID, 'background', $imgsrcparam ); ?>
<div ><?php echo "$thumbID"; ?></div>
<?php } ?>


<h2>"><?php the_title(); ?></h2>
<?php the_excerpt(); ?>
<div class="postmetadata">
Posted: <?php the_time(__('F jS, Y', 'kubrick')) ?>ˑ
<?php comments_popup_link(__('No Comments'), __('1 Comment'), __('% Comments'), '', __('Comments Closed') ); ?>

<?php printf(__('Filled under: %s'), get_the_category_list(', ')); ?>
</div>

<?php endwhile; ?>
<?php else : ?>
<?php endif; ?>[/list]