28173 sujets

CSS et mise en forme, CSS3

Centrage d'un bloc composé d'un texte et d'une image.

J'ai un div en position absolu (longueur fixe) et j'aimerais qu'une image
soit centrée mais que le texte accompagnant l'image soit aligné au début de l'image.

Exemple:

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
x             Text                                           x
x             xxxxxxxxxxxxxxxxxxxxxxxxx                      x
x             x Image de longueur     x                      x
x             x variable qui doit     x                      x
x             x être centrée          x                      x
x             xxxxxxxxxxxxxxxxxxxxxxxxx                      x
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx


Je suis à votre disposition si ma demande n'est pas trés claire
Veuillez m'excuser, le "Bonjour" matinal a dû sauter alors je réitère ma question:

Bonjour,

Après de nombreux essais dont voici l'un d'eux:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
    <head>
        <title>Center a picture and a text</title>
        <style type="text/css">
        #abs_div {
          position:absolute;
          top:0px; left:0px;
          width:820px;
          border:1px solid red;
          text-align:center;
        }
        #ad_container {
          border: 1px solid green;
          text-align:left;
        }
        #ad_content {
          display:block;margin-left:auto;margin-right:auto;
        }
        #ad_text {
          background-color:black;
          color:lime;
          font-weight:bolder;
        }
        </style>
    </head>

    <body>
    <div id="abs_div">
        <div id="ad_container">
            <span id="ad_text">Texte publicitaire</span>
            <img id="ad_content" src="img.gif">
        </div>
    </div>
    </body>
</html>


je ne suis pas arrivé à une solution parfaite. Voilà ce que je désire avoir:

Une image (panneau publicitaire crée avec du javascript) centrée dans un bloc (position absolue). Le texte accompagnant l'image doit être aligné (à gauche) avec le début de l'image. La largeur de la bannière publicitaire (FullBanner ou LeaderBoard) n'est pas connue d'avance.

Exemple:


xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
x             Texte aligné à gauche                          x
x             xxxxxxxxxxxxxxxxxxxxxxxxx                      x
x             x Image de longueur     x                      x
x             x variable qui doit     x                      x
x             x être centrée          x                      x
x             xxxxxxxxxxxxxxxxxxxxxxxxx                      x
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx



Je suis à votre disposition si ma demande n'est pas trés claire.

Et veuillez accepter toutes mes excuses pour le non respet des règles élémentaires de politesse.
Bonjour

Permmettez-moi un petit up.

Personne pour m'aiguiller vers une solution? Ou est-ce impossible sans utiliser la balise table?



Bien bonjour chez vous
Sujet clos
Aller à