28172 sujets

CSS et mise en forme, CSS3

Bonjour j'essaye tant bien que mal à passer de la mise en page tableau à la mise en page CSS et je bloque sur le positionnement précis des DIV. (en image jointe ce que ça me donne a l'heure actuelle)

Je voudrais dans ma div cela:

Titre(en haut a gauche) date (en haut à droite)
lien image (sous la date)
texte dynamique ( plus ou moins long ...)

Flèche retour en haut (image en bas à droite)

J'ai fait des DIV dans les DIV mais le problème est que les DIV, date, lien image et flèche retour en haut se mettent horizontalement l'une a coté de l'autre.
Moi je voudrais qu'elles se mettent l'une en dessous de l'autre, que quand la DIV texte dynamique en longue, la DIV flèche retour en haut suive le tes texte et se mette tout en bas.
(un genre de tableau a 2 colonnes et 3 lignes)

D'avance merci pour votre aide. J'ai essaye de comprendre le positionnement relatif absolu, flottant , je ne saisi vraiment pas tout !!!!!

Au secour
Modifié par loulou8407 (29 Sep 2009 - 09:47)
Bonjour,

Je ne suis pas sûre que le message soit complet...

Pour mettre un titre en haut à gauche, rien de plus simple, c'est sa position par défaut (s'il est le premier élément HTML).
Oui bien sur,

Voila le code d'affichage :

Code PHP supprimé. C'est complètement illisible si on ne connait pas à la fois PHP et le fonctionnement de ton site. Nous sommes dans le salon CSS, et le code CSS s'applique à du HTML, pas à du PHP.

--------------et la partie CSS-------------

#affichage_recherche_actualites_accueil{	
	background-color: white;
	height:80px;
	margin-top: 10px;
	padding: 6px;
	color: #666;
}
.date {
	float: right;	
	color: #6495ed;
	font-style: italic;
	text-decoration: underline;
	font-size: 11px;		
}
.fleche_haut{	
	right:15px;	
	vertical-align:bottom;
	float:right;
	margin-bottom:5px;
	position:relative;
}
#lien{
	position:relative;
	float:right;
}


Je vais lire gabarits de Florent tout de suite

Merci
Modifié par Florent V. (29 Sep 2009 - 11:36)
Alors,

Première chose : merci de vien vouloir éditer ton message et d'y ajouter les balises [ code] pour délimiter les portions de code (bouton code avec une liste déroulante pour choisir le langage).

Seconde chose : Je (comme beaucoup j'espère) ne dispose pas d'un interpréteur PHP dans mon cerveau. Il serait donc préférable de nous donner le code HTML produit par le serveur PHP.

Pour finir : je pense qu'un peu de lecture supplémentaire te serait utile.