28172 sujets

CSS et mise en forme, CSS3

Bonjour,

En création d'un site avec joomla 2.5, j'ai inséré un bouton en bas de ma zone de texte pour revenir au choix des différentes activités proposées.

Le problème est que ce bouton-texte est positionné par rapport au paragraphe alors que je souhaite qu'il soit situé juste un peu au dessus de la limite basse de la zone rt-container.

Voici 2 exemples, l'un ou il a beaucoup de texte et le bouton apparaît bien en bas de zone, l'autre exemple avec peu de texte et le bouton n'apparaît pas en bas de zone.

upload/52440-Capture1.JPG upload/52440-Capture2.JPG

Voilà mon code html :
upload/52440-Capture3.JPG

Voilà mon code CSS :
/* main */
#rt-main {}
#rt-main .rt-container {background: url(../images/maquette/fond.jpg); transparent; width: 1014px;}
#rt-main .rt-container .boutonactivites {text-align: right; position: absolute; bottom: -45px; left: 470px;}
#rt-main .rt-container a.retouractivites {background: #806E5A; color: #fff; padding: 6px; border-radius: 6px; font-weight: bold;}
#rt-main .rt-container .rt-block {}
#rt-main .rt-container .rt-block .rt-article {margin-top: 20px; margin-left: -20px;}
#rt-main .rt-container .rt-block .rt-article-bg {border-bottom: 0px; padding-bottom: 0px;}

Je voudrais éviter d'avoir à modifier la valeur de bottom à chaque fois que je modifie le texte.
Comment puis-je procéder pour que ce bouton soit automatiquement placé en bas de page ?
J'ai essayé en changeant la position absolute par relative... mais je ne trouve pas la solution ?

Merci d'avance de votre aide.
Pour poster du code, sous l’éditeur tu as des boutons «HTML», «CSS» ou encore «PHP». Ça sera beaucoup plus lisible qu’une image ou qu’un paragraphe normal !

Pour ton problème de positionnement, si tu ajoutes position: relative à ton .rtcontainer, ton bouton se positonnera en fonction de lui. Voilà un peu de lecture (que tu aurais trouvé en cherchant un peu).

PS: La sémantique est une bonne idée pour le référencement et l’accessibilité, tu devrais songer à utiliser des balises HTML intéressantes plutôt que de produire une soupe de <div> indigeste Smiley cligne
Merci pour tes conseils.
Pour info, avant de poster ce sujet, j'ai fait toutes les recherches nécessaires en passant des heures à chercher des sujets similaires, dont celui que tu m'envoies.
J'ai fait de nombreux essais divers et variés, je viens de faire ce que tu me conseilles en appliquant la position relative au rtcontainer mais ça ne change rien, le bouton reste positionné en fonction du texte et non du container.

Je suis très loin d'être experte en création de site, en HTML et en CSS, donc ta remarque en PS est pour moi du chinois ! Désolée.