Mettre un texte dans le coin droit en bas d'un div ?

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Mettre un texte dans le coin droit en bas d'un div ?

Profil supprimé

Ca doit être tout con mais je trouve pas. :heink:

Je souhaite placer la date dans le coin en bas à droite de mon en-tête. J'ai réussi à le placer à droite avec "text-align" mais je sais pas le mettre sur la dernière ligne.

De plus, je veux que l'alignement à droite ne soit pas collé avec le bord. Mais si je met un padding:5px; ca me décale également la bordure de mon <body>

Code :

#en_tete
{
width:800px; /* taille de l'image */
height:128px;
background-image: url("bandeauhead.png" );
background-position: center;
background-repeat:no-repeat;
border-bottom: 1px solid black;
text-align:right;
font-size:0.9em;
}

En rajoutant line-height:230px;
j'ai réussi à le placer à peu près verticalement, mais je trouve ca pas top comme solution, il a fallu que je règle pixels par pixels... etc

Publicité

nico168

essaye vertical-align: bottom;

gm_superstar

Appelez-moi Super

Il faudrait utiliser le positionnement absolu pour placer le texte là où tu veux. (avec bottom et right).

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

gm_superstar

Appelez-moi Super

nico168 a écrit :

essaye vertical-align: bottom;

Non

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

Profil supprimé

d'après les plusieurs posts que j'ai lu sur divers forums, quand on a une seule ligne à aligner, ce qui est mon cas (ma date ) la technique avec line-height semble être la meilleure. Donc je vais la garder.

Je compte remplacer la date par le code PHP correspondant pour un affichage automatique, ca devrait pas poser problème si ?

PS : comment décaler le texte un peu du bord droit ? l'image de fond vient avec... avec le padding..

Message édité par Profil supprimé le 09-02-2005 à 20:52:20

gm_superstar

Appelez-moi Super

jeep05 a écrit :

Je compte remplacer la date par le code PHP correspondant pour un affichage automatique, ca devrait pas poser problème si ?

Non pas de problème.

jeep05 a écrit :

PS : comment décaler le texte un peu du bord droit ? l'image de fond vient avec... avec le padding..

Ben avec le positionnement absolu tu places le texte où tu veux

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

Profil supprimé

pour faire un positionnement absolu, il me faut le mettre entre des balises <p> alors et attribuer un id à la balise ?

J'ai fait comme ca:

Code :

<div id="en_tete">
<span class="date"><? $date = date("d/m/Y" );
echo $date; ?></span>
</div>

Code :

.date
{
position:absolute;
bottom: 5px;
right: 5px;
}

j'ai du mal à différencier relative et absolu. On pouvait arriver au meme résultat avec les 2 non ?

Message édité par Profil supprimé le 09-02-2005 à 21:37:39

gm_superstar

Appelez-moi Super

jeep05 a écrit :

pour faire un positionnement absolu, il me faut le mettre entre des balises <p> alors et attribuer un id à la balise ?

Pour mettre un élément en position absolu il faut utiliser "position: absolute" comme tu l'as fait. Peu importe que ce soit un <div>, un <p> ou un <blockquote> et peu importe comment on le sélectionne.

jeep05 a écrit :

J'ai fait comme ca:

C'est très bien, mais il faut que l'élément qui contient l'élément en positionnement absolu soit lui même positionné. Car là, ton span sera à 5px du bord inférieur droit de ta page et pas du DIV.

Il faut donc positionner le DIV, et un simple

div#en_tete {
position: relative;
}

suffira.

Cf http://incongru.webdynamit.net/PositionnementCss

jeep05 a écrit :

j'ai du mal à différencier relative et absolu. On pouvait arriver au meme résultat avec les 2 non ?

Ce serait beauoup plus compliqué avec le positionnement relatif.

Message édité par gm_superstar le 09-02-2005 à 22:00:12

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

Profil supprimé

merci pour tes réponses claires, nettes et précises j'apprécie.

Je peux mettre un "id" au lieu du "class" ca suffit pour date ?
Donc au final :

Code :

<div id="en_tete">
<span id="date">
<? $date = date("d/m/Y" );
echo $date; ?>
</span>
</div>

Code :

span#date
{
font-size:0.9em;
text-align: right;
position:absolute;
bottom: 5px;
right: 5px;
}

Message édité par Profil supprimé le 09-02-2005 à 22:49:11

FORUM HardWare.fr

Programmation

HTML/CSS

Mettre un texte dans le coin droit en bas d'un div ?

Sujets relatifs
Générer une image avec du texte déformé pour empecher le spam	JTree et texte tronqué..
requête SQL dans value d'une zone texte?	[Java] Editeur de Texte
Texte défilant	POSTGRESQL comment mettre un time out session
affichage automatique dans zone texte grace listbox	mettre des references dans une table
Mettre un nom aléatoire à un fichier uploadé.	Espacement vertical du texte
Plus de sujets relatifs à : Mettre un texte dans le coin droit en bas d'un div ?

Page générée en 0.061 secondes