Float non-fonctionnel en absence de contenu

Bonjour à tous.

Je suis en train de créer un thème wordpress, et j'ai un problème concernant un copmportement étrange de la sidebar. (Je n'ai pas eu de problème avec le CSS dans la quasi-totalité de la création du thème, et j'ai quelques bases, c'est pour cela que je me permets de vous déranger).

J'utilise une même structure pour la plupart de mes pages, contenant une div page avec une largeur fixe, qui contient elle même une div main et une div sidebar, toutes les deux à largeur fixe.
La somme des largeurs de ces deux dernières divs n'excède pas celle de la div parente (la div page si vous suivez ), et la div main a un float:left, tandis que la div sidebar a un float:right.

Sur la page d'accueil et les pages statiques du blog, je n'ai aucun problème.
Le problème apparaît sur les pages d'articles ne contenant pas encore de commentaires.

Lorsque qu'aucun commentaire n'est présent, ma sidebar va se loger à l'extrême droite ma page (pas la div, la page internet entière), alors que lorsque qu'un (ou plusieurs) commentaire est présent, elle revient à sa place.

J'ai essayé de rajouter à des endroits que je pensais propices des divs de nettoyage avec un clear:both; ou d'autre techniques trouvées sur le net (contenu texte non dynamique, div invisible, etc.) sans résultat. Ce problème apparaît sur tous les navigateurs.

Bref, avez-vous déjà eu ce genre de problème, lié a un float non respecté en l'absence d'un contenu, qui se remet soudain a fonctionné en présence de ce dernier ?

Voici mon CSS :

#page {
width:940px;
margin: 0 auto -60px auto;
}
 
#main {
width:650px;
text-align:justify;
float:left;
}

#sidebar {
width:250px;
text-align:justify;
float:right;
border-left:solid 1px #444;
}

Et le template des commentaires :

<?php // Do not delete these lines
if ('comments.php' == basename($_SERVER['SCRIPT_FILENAME'])) die ('Ne pas t&eacute;l&eacute;charger cette page directement, merci !');
if (!empty($post->post_password)) { // if there's a password
	if ($_COOKIE['wp-postpass_' . COOKIEHASH] != $post->post_password) {  // and it doesn't match the cookie
?>

<h2><?php _e('Prot&eacute;g&eacute; par mot de passe'); ?></h2>
<p><?php _e('Entrer le mot de passe pour voir les commentaires'); ?></p>

<?php return;
	}
}

	/* This variable is for alternating comment background */

$oddcomment = 'alt';

?>
<!-- You can start editing here. -->

		
<div id="cadrecommentaires">
		<?php if ($comments) : ?>
			<h3 id="comments"><?php comments_number('Pas de commentaire', 'Un commentaire', '% commentaires' );?> pour &#8220;<?php the_title(); ?>&#8221;</h3>
		
		
		<div id="corps">
				<ol class="commentlist">
						
				<?php foreach ($comments as $comment) : ?>
				
						<li class="<?php echo $oddcomment; ?>" id="comment-<?php comment_ID() ?>">
		
		
		
		<div class="commentmetadata">
				
				<strong><?php comment_author_link() ?></strong> <small><em><?php _e('('); ?><a href="#comment-<?php comment_ID() ?>" title=""><?php comment_date('j F Y') ?>  <?php _e('&agrave;');?> <?php comment_time() ?></a> <?php _e(')'); ?></em></small><?php _e('&#58;'); ?> <?php edit_comment_link('Edit Comment','',''); ?>
						<?php if ($comment->comment_approved == '0') : ?>
						<em><?php _e('Votre commentaire est en cours de mod&eacute;ration'); ?></em>
						<?php endif; ?>
		</div>
		
		<div id="gravatar">
				<a class="gravatar">
						<?php 
						
						
						if (function_exists('get_avatar')) {
						      echo get_avatar( $comment, 80, $mygravatarurl);
						   } else {
						      //alternate gravatar code for < 2.5
						      $grav_url = "http://www.gravatar.com/avatar.php?gravatar_id=" . md5($email) . "&default=" . urlencode($default) . "&size=" . $size;
						      echo "<img src='$grav_url' height='80px' width='80px' />";
						   }
						?>
				</a>
		</div>
				
		<?php comment_text() ?>
		
						</li>
		
		<?php /* Changes every other comment to a different class */
			if ('alt' == $oddcomment) $oddcomment = '';
			else $oddcomment = 'alt';
		?>
		
		<?php endforeach; /* end for each comment */ ?>
				</ol>
		
		<?php else : // this is displayed if there are no comments so far ?>
			
			<h3>Pas de commentaire</h3>		
		
			Il n'y a pas encore de commentaire. Soyez le premier &agrave; commenter !
			
			
				
		<?php if ('open' == $post->comment_status) : ?>
			<!-- If comments are open, but there are no comments. -->
			<?php else : // comments are closed ?>
							<!-- If comments are closed. -->
		<p class="nocomments">Les commentaires sont ferm&eacute;s !</p>
		
			<?php endif; ?>
		<?php endif; ?>
	</div>	
</div>

		




<?php if ('open' == $post->comment_status) : ?>

		<h3 id="respond">Laissez un commentaire</h3>

		<em>Gravatar vous permet de rendre vos commentaires plus personnels. Inscrivez-vous !</em><br/>
		
<?php if ( get_option('comment_registration') && !$user_ID ) : ?>
<p>Vous devez &ecirc;tre <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?redirect_to=<?php the_permalink(); ?>">connect&eacute;</a> pour laisser un commentaire.</p>

<?php else : ?>

<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
<?php if ( $user_ID ) : ?>

<p>Logged in as <a href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?action=logout" title="D&eacute;connect&eacute; de ce compte">D&eacute;connection &raquo;</a></p>

<?php else : ?>

<p><input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="40" tabindex="1" />
<label for="author"><small>Nom <?php if ($req) echo "(requis)"; ?></small></label></p>

<p><input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="40" tabindex="2" />
<label for="email"><small>email (ne sera pas publi&eacute;) <?php if ($req) echo "(requis)"; ?></small></label></p>

<p><input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="40" tabindex="3" />
<label for="url"><small>Site Web</small></label></p>

<?php endif; ?>

<div class="clear"></div>

<!--<p><small><strong>XHTML:</strong> <?php _e('Vous pouvez utiliser ces tags&#58;'); ?> <?php echo allowed_tags(); ?></small></p>-->

<p><textarea name="comment" id="comment" cols="60" rows="10" tabindex="4"></textarea></p>

<p><input name="submit" type="submit" id="submit" tabindex="5" value="Envoyer" />
<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />
</p>

<?php do_action('comment_form', $post->ID); ?>


</form>

<?php endif; // If registration required and not logged in ?>

<?php endif; // if you delete this the sky will fall on your head ?>

Je travaille en local, je n'ai donc pas d'url à vous fournir.

Merci beaucoup.
Modifié par RBL (24 Nov 2010 - 18:14)

Salut !

Je suis persuadé que c'est un problème avec tes floats
http://www.alsacreations.com/astuce/lire/7-depassement-flottants-css.html
http://gtwebdev.com/workshop/floats/enclosing-floats.php

De plus, si tu réussis pas à régler ton problème, tu peux nous copier le code source de ta page html comme ça on pourrait mieux visualiser voir ton code HTML plutôt que ton code PHP ( qui nous est inutile )

Bonne chance !