Mettre une image en Float left a coté d'une liste a puce à droit

Fermé

Titoforlife - 15 janv. 2016 à 09:31
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 - 19 janv. 2016 à 13:46

Bonjour,

Comment faire pour mettre a gauche une image en Float, et a droite de celle ci une liste a puce, je ne trouve pas les combinaisons gagnates ?!

A voir également:

Mettre une image en Float left a coté d'une liste a puce à droit
Liste déroulante excel - Guide
Image libre de droit gratuite google - Guide
Recherche à partir d'une image - Guide
Gertrude a préparé la liste des affaires à prendre pour l'excursion. juliette a modifié cette liste en utilisant le mode suivi des modifications proposé par le traitement de texte. - Guide
Frédéric cherche à faire le buzz sur les réseaux sociaux. il a ajouté une image de manchots sur une image de plage. retrouvez l'image originale de la plage. que cachent les manchots ? - Forum Graphisme

4 réponses

Réponse 1 / 4

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
15 janv. 2016 à 14:27

Salut,

Comme ceci ?

<img src="image.jpg" class="monimage">
<ul class="maliste">
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>

.monimage, .maliste {
    float: left;
}

Bonne journée

Titoforlife
15 janv. 2016 à 15:09

cela ne fonctionne pas , j'ai essayé de faire float right sur ma liste sans résultat, en laissant float left a ma liste elle se met toujours en bas de mon image :/

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
15 janv. 2016 à 15:28

Pourtant on peu difficilement faire plus simple : https://jsfiddle.net/u41jo4q3/
Une autre solution est d'utiliser display: inline-block; pour aligner des éléments horizontalement.

Peux tu nous montrer ton code ?

Réponse 2 / 4

Titoforlife
15 janv. 2016 à 16:01

<body>
    <h1> Lavier anthony </h1>
   <p> Bénévole au sein d'une association </p> <br/>
  
  <p>
    <img src="1.png"/>
</p>

   <h2> Mon Expérience </h2>
  
<h3> Création d'une association <em> Gaia & Compagnie </em> dans l'évenementiel </h3>
  
  

<img src="fond2.png" class="monimage">

<ul class="maliste">
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>







    </body>
</html>

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
15 janv. 2016 à 17:24

Quelles sont les dimensions de l'image fond2.png stp ?

Titoforlife > Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022
16 janv. 2016 à 09:21

l'image fait 137/90 pourquoi la taille peut poser problème?

Réponse 3 / 4

Titoforlife
15 janv. 2016 à 16:03

code CSS :

.monimage, .maliste
{
    float: left;
}

Réponse 4 / 4

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
19 janv. 2016 à 13:46

En reprenant ton code, la liste se positionne bien à coté de l'image (à condition que la fenêtre ai une largeur supérieur à la largeur de l'image + la largeur de la liste) : https://jsfiddle.net/rL917acv/

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?

A quoi correspond cette croix sur snapchat

Aligner 2 photos côte à côte...

comment donner les droits sur fichier partage

Sur la plage...

Discussions similaires

Newsletters