Aligner un texte avec son image

Résolu

Html
Css

Philosophe-du-88 Messages postés 7 Statut Membre -
Philosophe-du-88 Messages postés 7 Statut Membre - 18 oct. 2012 à 19:01

Salut à tous,

Je souhaiterais apparaitre mon texte à droite de l'image du lien. Cependant, je n'arrive pas à la centrer par rapport à l'image, le texte reste en bas de celle-ci, à droite.

Voici le "code" :

<li><a href="audio.php"><img src="Docs/audio.png" title="Audio - Music" alt="Audio - Music" />Audio</a></li>

Merci d'avance, bonne soirée

Afficher la suite

A voir également:

Comment aligner un texte avec une image html
Comment aligner une image et un texte en html - Meilleures réponses
Comment aligner un texte et une image en html - Meilleures réponses
Extraire texte d'une image - Guide
Editeur html - Télécharger - HTML
Comment mettre un texte sous une image html - Forum CSS
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 Windows
Comment légender une image - Guide

3 réponses

Réponse 1 / 3

Freedomsoul Messages postés 538 Statut Membre 97

HTML:

<li><a href="audio.php"><img class="img_vcenter" src="Docs/audio.png" title="Audio - Music" alt="Audio - Music" /><span>Audio</span></a></li>

css:
img_vcenter
{

vertical-align: middle;

}

Philosophe-du-88 Messages postés 7 Statut Membre

Ca fonctionne nickel, merci Freedomsoul !

Réponse 3 / 3

mpmp93 Messages postés 2931 Date d'inscription Statut Membre Dernière intervention 1 341

Bonsoir,

Une image dans un LI ????

Essayer ça:

<figure>
    <img src="Docs/audio.png" title="Audio - Music" alt="Audio - Music" />
    <figcaption>Audio</figcaption>
</figure>

et le CSS qui va bien:

<style type="text/css">
   figure { display: block; text-align: left; padding-left: 12px; }
   img { max-width: 100%; }
   figcaption { display: block; }
</style>

A+

Rodolphe_ Messages postés 1572 Statut Membre 290

perso je ne vois rien de choquant à mettre une image dans un li, une image peut tout à fait être intégrée dans une liste ordonnée ou non.

Philosophe-du-88 Messages postés 7 Statut Membre

Mon image est une simple icone faisant office de lien pour accéder à une autre page (d'ou son intégration dans une balise li). J'aurais aimé mettre le texte pile à droite (ce que j'arrive à faire), au centre de l'image (ce que je n'arrive pas du tout à faire). pour le moment mon css est le suivant :

#menu ul li{list-style-type: none;display:block;text-align:left;}

et di coté html

<div id="menu">
<ul>
<li><a href="audio.php"><img src="Docs/audio.png" title="Audio - Music" alt="Audio - Music" />Audio</a></li>
(...)

quelqu'un a une idée ?

Merci

Discussions similaires

Comment créer une barre horizontale HTML/CSS?

html/css: faire une belle barre de recherche

comment agrandir une image en css

paragraphe cote a cote

Deplacer une image avec HTML et CSS

Séparer le css et le js du html

Discussions similaires

Newsletters