Comment aligner mon menu ?
Utilisateur anonyme
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour je suis un jeune débutant en programmation et je souhaiterai aligner mon menu sur ma page html , à savoir que je n'ai pas mis des mots mais des images avec des liens dans les balises <li> merci d'avance de votre réponse .
Voici mon code :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Monkey gaming</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<a href="mon_site.html"><img src="monkey.PNG" alt=""height="10%" width="6%"/></a>
<p><a href="INSCRIPTION"></a><p>
<header>
<li class="navigation">
<ul><a href="mon_site.html"><img src="acceuil.PNG" alt="Acceuil" height="30%" width="30%"</a></ul>
<ul><a href=""><div id="#2"><img src="dessin-5.PNG" alt="Recherche" height="30%" width="30%"/></a></ul>
<ul><a href=""><img src="moncompte.PNG" alt="Mon compte" height="30%" width="30%"/></a></ul>
<ul><a href=""><img src="options.PNG" alt="Options"height="30%" width="30%"/></a></ul>
<ul><a href=""><img src="autres.PNG" alt="Autres" height="30%" width="30%"/></a></ul>
</li>
</header>
<section>
<article>
<center><iframe align="top" src="https://www.twitch.tv/monkey_gaming_on_twitch/embed" frameborder="0" scrolling="no" height="378" width="620"></iframe><a href="https://www.twitch.tv/monkey_gaming_on_twitch?tt_medium=live_embed&tt_content=text_link" style="padding:2px 0px 4px; display:block; width:345px; font-weight:normal; font-size:10px;text-decoration:underline; text-align:center;"></a></center>
</article>
</section>
<article>
</article>
<footer>
<p><a href="https://www.instant-gaming.com/fr/"><img src="logo.PNG" alt="Instant Gaming" height="10%" width="10%"/></a></p>
</footer>
</body>
</html>
Et voici mon code css:
*
{
color: rgb(255,0,68);
font-family: Comic sans MS;
}
body
{
background-image: url("dessin-1.PNG");
background-attachment: scroll;
background-color: grey;
position:relative;
height:1000px;
}
.navigation
{
float:right;
top:15px;
right:35px;
position:absolute;
display: inline;
width: 740px;
text-align: right;
list-style-type: none;
width: 740px;
display:inine-block;
}
footer
{
float:bottom;
}
Voici mon code :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Monkey gaming</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<a href="mon_site.html"><img src="monkey.PNG" alt=""height="10%" width="6%"/></a>
<p><a href="INSCRIPTION"></a><p>
<header>
<li class="navigation">
<ul><a href="mon_site.html"><img src="acceuil.PNG" alt="Acceuil" height="30%" width="30%"</a></ul>
<ul><a href=""><div id="#2"><img src="dessin-5.PNG" alt="Recherche" height="30%" width="30%"/></a></ul>
<ul><a href=""><img src="moncompte.PNG" alt="Mon compte" height="30%" width="30%"/></a></ul>
<ul><a href=""><img src="options.PNG" alt="Options"height="30%" width="30%"/></a></ul>
<ul><a href=""><img src="autres.PNG" alt="Autres" height="30%" width="30%"/></a></ul>
</li>
</header>
<section>
<article>
<center><iframe align="top" src="https://www.twitch.tv/monkey_gaming_on_twitch/embed" frameborder="0" scrolling="no" height="378" width="620"></iframe><a href="https://www.twitch.tv/monkey_gaming_on_twitch?tt_medium=live_embed&tt_content=text_link" style="padding:2px 0px 4px; display:block; width:345px; font-weight:normal; font-size:10px;text-decoration:underline; text-align:center;"></a></center>
</article>
</section>
<article>
</article>
<footer>
<p><a href="https://www.instant-gaming.com/fr/"><img src="logo.PNG" alt="Instant Gaming" height="10%" width="10%"/></a></p>
</footer>
</body>
</html>
Et voici mon code css:
*
{
color: rgb(255,0,68);
font-family: Comic sans MS;
}
body
{
background-image: url("dessin-1.PNG");
background-attachment: scroll;
background-color: grey;
position:relative;
height:1000px;
}
.navigation
{
float:right;
top:15px;
right:35px;
position:absolute;
display: inline;
width: 740px;
text-align: right;
list-style-type: none;
width: 740px;
display:inine-block;
}
footer
{
float:bottom;
}
A voir également:
- Comment aligner mon menu ?
- Menu déroulant excel - Guide
- Canon quick menu - Télécharger - Utilitaires
- Windows 11 menu contextuel classique - Guide
- Windows 11 menu démarrer classique - Guide
- Réinitialiser menu démarrer windows 10 - Guide
4 réponses
Salut,
Quelques corrections :
- tu as inversé les balises ul et li. Une liste se construit comme ceci :
- tu as oublié de fermer la première balise img de ton menu
- tu as un <div id="#2"> non fermé (je ne sais pas ce qu'il fait là)
- la balise <center> est obsolète et ne devrait pas être utilisée (surtout en html5)
Peux tu préciser un peu plus ce que tu souhaites ? Comment veux tu aligner ton menu ? Horizontalement et centré au milieu de l'écran ?
Quelques corrections :
- tu as inversé les balises ul et li. Une liste se construit comme ceci :
<ul>
<li>list item 1</li>
<li>list item 2</li>
</ul>
- tu as oublié de fermer la première balise img de ton menu
- tu as un <div id="#2"> non fermé (je ne sais pas ce qu'il fait là)
- la balise <center> est obsolète et ne devrait pas être utilisée (surtout en html5)
Peux tu préciser un peu plus ce que tu souhaites ? Comment veux tu aligner ton menu ? Horizontalement et centré au milieu de l'écran ?
Tout d'abord merci de ta réponse oui je sais c'est un peu n'importe quoi mon code html mais bon je fais comme je peux ;-)
En fait je voudrais mettre mon menu en haut à gauche en aligné au lieu que les mots se mettent les uns en dessous des autres .
Merci d'avance de ta réponse
En fait je voudrais mettre mon menu en haut à gauche en aligné au lieu que les mots se mettent les uns en dessous des autres .
Merci d'avance de ta réponse