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 :

habillage : rapproché


Sujet :

HTML

  1. #1
    Membre à l'essai
    habillage : rapproché
    Bonjour,

    Je suis en train de créer un mon squelette pour un webzine à partir de squelettes existant mais ne me convenant pas.
    Je commence à voir le bout mais il me reste quelques finitions dont celle-ci.
    J'ai beau chercher, je ne trouve pas comment il et possible d'avoir un habillage rapproché du texte et de l'image comme dans Word sur une page web.
    J'arrive à avoir l'image puis le texte à la suite, l'image puis le texte à la ligne mais pas les deux rapprochés.
    Pourtant, ça se trouve, c'est tout con ?!

    Que devrais-je ajouter à mon code pour que ça fonctionne :
    Code :Sélectionner tout -Visualiser dans une fenêtre à part
    <div id="desg">[(#LOGO_ARTICLE|center||reduire_all_images{100,x})] [(#DESCRIPTIF)]<a href="#URL_ARTICLE"></a></div>

    Vous pouvez voir mon problème ici. Sur le deuxième "résumé" d'article test, j'aimerais qu'il y ait plusieurs lignes de ce résumé à droite de l'image mais qu'une fois arrivé à la même hauteur de texte que l'image, il continue sur tout la largeur de la cellule.
    J'espère que j'ai réussi à me faire comprendre.
    Merci
    ++

  2. #2
    Rédacteur/Modérateur

    c'est pas hier qu'in en a parlé de ça ???

    float left sur l'image ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

    réalisations :www.oxygen-translations.fr|www.saftair.fr| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

  3. #3
    Membre à l'essai
    Merci SpaceFrog,

    Je n'ai pas vu ça hier par contre.
    J'ai essayé ce que tu m'a dis et c'est bien cette fonction que je dois utiliser.
    Malheureusement, je ne dois pas la placer là où il faut.
    Dans ma boucle, les articles se mettent les uns sous les autres et avec la fonction float, au lieu de se baser sur la hauteur de l'image (lorsqu'elle est plus grande que la hauteur du texte) pour afficher le deuxième article, ça se base toujours sur le texte, ce qui fait que le deuxième article débute sous l'image du premier.
    Je ne sais pas si j'ai réussi à me faire comprendre.
    Je laisse un bout de code si quelqu'un peut me dire où placer la fonction float:left
    code avec float left mal placé :
    Code :Sélectionner tout -Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    			<div id="cadre">
    			<h1>Les Derniers Articles</h1>
    			<BOUCLE_last_articles(ARTICLES){tout}{par date}{inverse}{doublons}{0,10}>
    				<div id="cadreBasGauche">	
    					<h2>
    						<a href="#URL_ARTICLE">[(#TITRE|supprimer_numero)]</a><br>
    						<BOUCLE_test_age(ARTICLES){id_article}{age><15}>				 
    						</BOUCLE_test_age>
    					</h2>
    					<div id="desg"><div style="float:left">[(#LOGO_ARTICLE|center||reduire_all_images{100,x})]</div> [(#DESCRIPTIF)]</div>
    				</div>
    			</BOUCLE_last_articles>
    			</div>

  4. #4
    Rédacteur/Modérateur

    mets le float left dans le conteneur de l'image ou dans l'image elle même

    Code :Sélectionner tout -Visualiser dans une fenêtre à part
    <img src="blab.gif" style=float:left;" /><div> et la je mets le commentaire ...</div>
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

    réalisations :www.oxygen-translations.fr|www.saftair.fr| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

  5. #5
    Membre à l'essai
    Merci SpaceFrog.
    J'ai réussi à utiliser le float left correctement en mettant texte et image dans un même tableau.

###raw>template_hook.ano_emploi###