28234 sujets

CSS et mise en forme, CSS3

Positionner un div à gauche du titre de chaque article sur WP

Bonjour,
une image vaut mille mots :

upload/9895-exempleCSSA.jpg

J'aimerais que la boite "wikio" ne soit pas au dessus du titre, mais à gauche (au même niveau).

Voilà le code html :

<div id="content" class="narrowcolumn">

	<?php if (have_posts()) : ?>

		<?php while (have_posts()) : the_post(); ?>

			<div class="post" id="post-<?php the_ID(); ?>">
				<span class="blogwikio"><?php wikiovote(); ?></span>
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Lien permanent vers <?php the_title(); ?>"><?php the_title(); ?></a></h2>
				
				<div class="entry">
					<?php the_content('Read the rest of this entry &raquo;'); ?>
				</div>



et voilà les classes CSS impliquées :

.narrowcolumn {
	float: left;
	padding: 0 0 20px 45px;
	margin: 0px 0 0;
	width: 450px;
	}

.post {
	margin: 0 0 40px;
	text-align: justify;
	}

.post hr {
	display: block;
	}

.blocwikio {
        float: left;
        margin:0px 0px 0px -50px;
}


merci d'avance...!
Quoi ? c'est tant que ça une question d'abruti ??? Smiley confused

j'ai cherché avec le moteur de recherche sur le forum, et je n'ai pas trouvé réponse à ma question.

Il y a bien un pro du CSS qui sait comment faire ça, non ?
lomig Unger a écrit :
Quoi ? c'est tant que ça une question d'abruti ??? Smiley confused

j'ai cherché avec le moteur de recherche sur le forum, et je n'ai pas trouvé réponse à ma question.

Il y a bien un pro du CSS qui sait comment faire ça, non ?

Bonjour,
Le sujet date du milieu de la matinée... Smiley sweatdrop

Le forum n'est pas un lieu de conseil-minute : les membres sont des bénévoles qui donnent de leur temps pour aider les autres, les dépanner et les encourager dans la voie à suivre. La plupart ont d'ailleurs un travail ou des cours à côté.

Sinon, pour infos la solution que tu cherches réside dans les flottants. Il faut faire flotter l'image à gauche et le titre viendra de lui-même se placer à droite.
merci beaucoup d'avoir pris le temps de répondre...

je file faire des essais avec float :left;

merci encore ! Smiley biggrin
Penser également à vérifier les marges du titre de niveau 2.
Elle peuvent être responsables de ce décalage.
Modifié par Cygnus (03 Oct 2008 - 15:59)
re-salut,
j'ai essayé avec float : ça marche pas...

je précise (c'était peut-être pas très clair) que j'ai utilisé un margin négatif pour placer la boite wikio dans la marge. Est-ce licite de faire cela ??? Smiley confused
Bonjour loming Unger,

Si tu ne déclare pas une largeur à ton flottant il vas prendre 100% de la place disponible et ton titre ne passera jamais à sa droite.

Mets une couleur de fond ou une bordure à ton .blocwikio pour voir ce qu'il fait (c'est un bon moyen de voir le comportement de chaque blocs)
Modifié par knarf (06 Oct 2008 - 13:46)
Sujet clos
Aller à