Problème de float

Bonjour à tous, je possède sur ma page d'accueil un système de news banal, cependant, je n'arrive pas à résoudre un problème esthétique.

Dans ce système de news, le titre de la news et la date de publication sont sur la même ligne. Le problème réside dans le fait que je n'arrive pas à Aligner le titre à gauche et la date à droite sur la même ligne, il faut savoir que ces 2 renseignements appartiennent à la même balise <h3>.

Merci de votre aide.

Corentin

Pour une visualisation de la page : www.anciela.info

salut,

pourquoi ne créé tu pas 2 classe?

.classe_gauche {
text-align:left;
}
.classe_droite {
text-align:right;
}

<span class="classe_gauche">Titre de la news</span>
<span class="classe_droite">Date de la news</span>

Parce que ça ne marche pas ?
En faisant les 2 classes, le text-align:right n'est pas pris en compte.

Je suis de la forme suivante :

<h3>Titre de la news - Date de la news</h3>

En essayant ceci :

<h3><span class="gauche">Titre de la news</span><span class="droite">Date de la news</span></h3>

Rien ne se passe

Merci encore.

re

j'ai trouvé la solution à ton problème...

voilà la source:

<h3>
<span class="gauche">Titre de la news</span>
<span class="droite">Date de la news</span>
</h3>

.gauche {
float:left;
}
.droite {
float:right;
}

Merci beaucoup, ça marche, mais en résolvant ce problème tu en as créer un autre...

En fait j'avais en background de mon <h3> une image répétée sur x, maintenant je ne vois qu'une ligne de cette image au dessus de mon titre... dois-je redéfinir le background sur les span ? Je teste...

EDIT : Une redéfinition du background sur les span est inutile aucun changement...
Modifié par Corentin_49 (15 Aug 2006 - 20:35)

a écrit :
Merci beaucoup, ça marche, mais en résolvant ce problème tu en as créer un autre... lol

oups^^

a écrit :
En fait j'avais en background de mon <h3> une image répétée sur x, maintenant je ne vois qu'une ligne de cette image au dessus de mon titre... ohwell dois-je redéfinir le background sur les span ? Je teste...

pourrais tu me montrer la source de ton h3?

<h3 class="titre_news"><span style="float:left;">
<?php
$titre = nl2br(stripslashes($donnees['titre']));
echo $titre; ?> - 
</span>
<span style="color:black; float:right;">
Le <?php echo date('d/m/Y à H\hi', $donnees['timestamp']); ?>
</span>
</h3>

.titre_news {
	color: #28598c;
	text-indent: 10px;
	border-bottom:1px solid #584024;
	font-size:12px;

	margin: 0px 0px -5px 0px;
	text-indent: 10px;
	line-height: 20px;
	background-image: url("img/fond_titre_news_test.jpg");
	background-repeat: repeat-x;
	}

Voilou voilou, si ça peut aider...
ou www.anciela.info/index_test.php pour visualiser
Modifié par Corentin_49 (15 Aug 2006 - 20:58)

bon j'ai testé et j'ai trouvé quelque chose...

j'ai mi un <br /> après les <span> et ca a mit l'image de fond...

pas mal ton site
Modifié par Clad Strife (15 Aug 2006 - 21:11)

L'image de fond apparait avec ta méthode... mais au dessus du titre et non derrière

Merci pour le compliment

Et merci de ton aide

:)

sinon tu peux essayer d'intervertir les <span> par des <div>

a écrit :
L'image de fond apparait avec ta méthode... mais au dessus du titre et non derrière ohwell

bah chez moi j'avais l'image derriere... j'avais mi un repeat-x et un repeat-y...

J'ai essayer d'intervertir span / div, de mettre un background derrière les span/div, de rajouter un repeat-y : rien n'y fait le background est au-dessus !

Cf www.anciela.info/index_test.php

Je suis sous firefox hein aussi.

Je viens de tester sous internet explorer sur le pc de ma mère... ça marche...

Arg !
Modifié par Corentin_49 (15 Aug 2006 - 22:26)

là j'avoue que rendre un site compatible IE et FF c'est la merde

enfin essaye de mettre les paramètres suivant dans ton style CSS:

.titre_news {
color: #28598c;
font-size:12px;
background-image: url("img/fond_titre_news_test.jpg");
background-repeat: repeat-x;
}

C'est fait, ça marche ... ça à l'air d'être le text-indent qui fait déconner le truc... Je fais des test

a écrit :
C'est fait, ça marche ... ça à l'air d'être le text-indent qui fait déconner le truc... Je fais des test smile

je pense plus aux margins...

mais je ne vois pas à quoi sert un text-indent dans ce cas...

content de t'avoir aidé ^^

si tu a 5 min tu pourrais m'aider à mon tour :s

voilà le lien
Modifié par Clad Strife (15 Aug 2006 - 22:51)

J'ai compris ce qui n'allait pas, text-indent avec les float ça fait pas copain copain

Le test-indent me servait lorsque tout était à gauche (je préfère au padding) mais j'ai pas calculer les float