IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

Format en escaliers avec des divs


Sujet :

HTML

  1. #1
    Candidat au Club
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    5
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2007
    Messages : 5
    Points : 3
    Points
    3
    Par défaut Format en escaliers avec des divs
    Bonjour à tous,

    Je m'arrache les cheveux.
    Je souhaiterais formater des blocs d'images et textes avec des <div>, mais je n'y arrive pas.
    Le format que j'essaie de faire est un peu spécial, il doit s'adapter à la largeur de la page. D'où l'idée d'utiliser des <div> avec le style float.
    Pas évident à décrire, alors j'ai fait un petit schéma (en pièce jointe).
    Les blocs image et texte 2 se placent soit à côté des blocs image et textes 1, soit en dessous, selon la largeur de la page.
    Les textes restent collés à leur image respective.

    J'en suis pas très loin, mais ça cafouille encore un peu...
    Est-ce qu'une bonne âme pourrait m'aider à faire ça ?

    Merci d'avance !!!
    --
    Philippe
    Images attachées Images attachées  

  2. #2
    Rédacteur
    Avatar de Macmillenium
    Homme Profil pro
    Développeur front-end
    Inscrit en
    Mars 2008
    Messages
    2 333
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur front-end
    Secteur : High Tech - Produits et services télécom et Internet

    Informations forums :
    Inscription : Mars 2008
    Messages : 2 333
    Points : 3 748
    Points
    3 748
    Par défaut
    Bonjour,

    Citation Envoyé par Obelix95 Voir le message
    J'en suis pas très loin, mais ça cafouille encore un peu...
    T'en es alors ?
    As-tu essayé ? si oui, merci de poster tes codes (X)HTML/CSS.

  3. #3
    Candidat au Club
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    5
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2007
    Messages : 5
    Points : 3
    Points
    3
    Par défaut
    Je ne crois pas que mon bout d'html soit une bonne base de départ ,
    mais bon...
    Voilà un test épuré avec 2 images bidon.

    Merci pour ton aide Macmillenium !
    --
    Philippe
    Fichiers attachés Fichiers attachés

  4. #4
    Candidat au Club
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    5
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2007
    Messages : 5
    Points : 3
    Points
    3
    Par défaut
    Bon,
    J'ai un peu avancé, c'est presque ça.
    Mon bout de code est joint.

    J'aurais juste aimé que le div de l'image2 (à droite) commence en haut de la page.
    Pas très grave.

    Si qq'un a une meilleure façon de faire, je suis preneur
    Fichiers attachés Fichiers attachés

Discussions similaires

  1. [Css]Soucis avec des div
    Par nebule dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 19/05/2006, 18h03
  2. Centrer une page avec des DIV imbriqués
    Par emstar dans le forum Balisage (X)HTML et validation W3C
    Réponses: 7
    Dernier message: 25/04/2006, 19h42
  3. [XHTML][CSS] simuler des frames avec des div
    Par piwai dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 09/11/2005, 14h26
  4. centrer un bloc avec des div+css
    Par fabrisss dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 28/10/2005, 00h41
  5. mettre en page avec des div
    Par mathieu_r dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 10/08/2005, 12h35

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo