CONNEXION
  • RetourJeux
    • Sorties
    • Hit Parade
    • Les + populaires
    • Les + attendus
    • Soluces
    • Tous les Jeux
    • Gaming
  • RetourActu Gaming
    • News
    • Astuces
    • Tests
    • Previews
    • Toute l'actu gaming
  • RetourBons plans
    • Bons plans
    • Bons plans Smartphone
    • Bons plans Hardware
    • Bons plans Image et Son
    • Bons plans Amazon
    • Bons plans Cdiscount
    • Bons plans Decathlon
    • Bons plans Fnac
    • Tous les Bons plans
  • RetourJVTech
    • Actus High-Tech
    • Intelligence Artificielle
    • Smartphones
    • Mobilité urbaine
    • Hardware
    • Image et son
    • Tutoriels
    • Tests produits High-Tech
    • Guides d'achat High-Tech
    • JVTech
  • RetourCulture
    • Actus Culture
    • Culture
  • RetourVidéos
    • A la une
    • Gaming Live
    • Vidéos Tests
    • Vidéos Previews
    • Gameplay
    • Trailers
    • Chroniques
    • Replay Web TV
    • Toutes les vidéos
  • RetourForums
    • Hardware PC
    • PS5
    • Switch 2
    • Xbox Series
    • Switch
    • Pokemon pocket
    • FC 25 Ultimate Team
    • League of Legends
    • Tous les Forums
  • PC
  • PS5
  • Xbox Series
  • Switch 2
  • PS4
  • One
  • Switch
  • iOS
  • Android
  • MMO
  • RPG
  • FPS
En ce moment Genshin Impact Valhalla Breath of the wild Animal Crossing GTA 5 Red dead 2
Liste des sujets

CENTRER SPAN...

Jujudufoot
Jujudufoot
Niveau 2
14 février 2016 à 15:53:59

Bonjour, voila mon code :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="style.css">
<title>ProgTuto</title>
</head>
<body>
<header>
<p class="image">
<img src="img/logo.png" alt="Logo ProgTuto" width="250" height="50"/>
<a href="index.html"><img src="img/home-menu.png" link="index.html" alt="Accueil" width="50" height="50"/>
<span>Accueil</span></a>
<a href="tuto.html"><img src="img/tuto-menu.png" link="tuto.html" alt="Tuto" width="50" height="50"/>
<span>Nos tutos</span></a>
<a href="contact.html"><img src="img/contact-menu.png" link="contact.html" alt="Contact" width="50" height="50"/>
<span>Nous-Contactez</span></a>
<a href="inscription.html"><img src="img/inscription-menu.png" link="inscription.html" alt="Inscription" width="50" height="50"/>
<span>S'inscrire</span></a>
</p>
</header>
<menu>

</menu>
<footer>

</footer>
</body>
</html>

Et le CSS :

.image span {
visibility: hidden;
}

.image img:hover + span {
visibility: visible;
}

Comment est ce que je pourrais centrer mes spans ? Merci de votre aide...

moxo75
moxo75
Niveau 6
14 février 2016 à 16:38:18
span{
text-align:center;
}

? J'ai pas lu ton code

Pseudo supprimé
Pseudo supprimé 14 février 2016 à 17:22:54

Salut,

Vire ta balise <p>, et utilises des titres à la place de tes span. Ce sera plus correct. Ensuite tu pourras faire un text-align.

squall4x
squall4x
Niveau 9
14 février 2016 à 17:31:50

<center></center> :oui:

Jujudufoot
Jujudufoot
Niveau 2
14 février 2016 à 17:53:53

Ne marche pas... warpShadow, je voudrai que le texte s'affiche que quand la souris et sur l'image... Merci quand même !

Message édité le 14 février 2016 à 17:54:08 par Jujudufoot
Jujudufoot
Jujudufoot
Niveau 2
14 février 2016 à 18:47:33

https://image.noelshack.com/fichiers/2016/06/1455471967-capture-d-ecran-2016-02-14-a-18-45-27.png

Voila le résultat, j'ai réussi avec jQuery !

Par contre comment le faire remonter à coté du logo ? Et comment enlever les parties grisées ?

Merci.

arbiterdu54
arbiterdu54
Niveau 6
16 février 2016 à 16:11:27

met un display:inline-block à ton image et les autres blocs, si le problème ne vient pas de là, alors la largeur de la page ne peut contenir tout sur une seule ligne

Sous forums
  • Aide à l'achat Mac
  • Création de Jeux
  • Linux
  • Création de sites web
  • Programmation
  • Internet
  • Steam Deck
  • Macintosh
  • Hardware
La vidéo du moment