Partage
  • Partager sur Facebook
  • Partager sur Twitter

Alignement d menu et logo ok mais puce indésirable

    23 avril 2019 à 15:30:43

    Bonjour,

     Je débute sur html5 et CSS3 et  j ai réussi en utilisant flex box  à mettre mon menu et logo sur la même ligne mais le problème c'est que je me retrouve avec des style de liste à puces  je ne sais pas ce qu'elles font là et j'essaie de les  enlever mais je n'arrive pas quelqu'un peut m'aiguiller ? Merci de votre aide:ange:

    body
    { 
    	background: url();/* which image */
    	font-family: 'Roboto', sans-serif;
    }
    
    
    .main-nav {
    	
    	display: flex;
    }
    .main-nav li:first-child {
    	margin-right: auto;
    }
    .main-nav a {
    	margin: 10px;
    	border-radius: 5px;
    	background: #fff;
    	color: #444D56;
    	display: block;
    	padding: 15px;
    	text-decoration: none;
    }
    .main-nav .logo {
    	list-style-type: none;
    	
    	
    }
    



    • Partager sur Facebook
    • Partager sur Twitter
      23 avril 2019 à 19:10:11

      voici le code html !

      Gracias

      <!DOCTYPE html>
      <html>
      <head>
      	<meta charset="utf-8">
      	<meta name="viewport" content="width=device-width, initial-scale=1">
      	<title>WebAgency: L'agence de tous vos projets</title>
      	<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet">
      	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
      
      
      	<link rel="stylesheet" type="text/css" href="style.css"> 
      
      	
      	
      </head>
      <body> 
      
      	<header> <!--en tête--> 
      		<div >
      			
      
      			<main> <!-- --> 
      
      				<nav  >
      
      					<ul class="main-nav">
      						<li> 
      							<img src="image/logo.png" alt=" logo WebAgency"></li>
      							<li> <a href="accueil.html">Accueil</a> </li>
      							<li> <a href="service.html">Service</a></li>
      							<li> <a href="portfolio.html">Portfolio</a></li>
      							<li> <a href="contact.html">Contact</a></li>
      						</ul>
      					</nav>
      
      				</header>
      
      				<section>
      					<aside></aside>
      				</section>
      			</main>	
      			<footer> </footer>
      
      		</body>
      
      		</html>
      
      
      • Partager sur Facebook
      • Partager sur Twitter
        23 avril 2019 à 19:51:53

        Bonjour,


        si tu veut que ca fonctionne ton list-style: none; il ne faut pas le coller sur " .main-nav .logo" mais sur ".main-nav"

        ou même sur ul

        -
        Edité par exen 23 avril 2019 à 19:54:50

        • Partager sur Facebook
        • Partager sur Twitter

        Compos sui.

          23 avril 2019 à 20:12:44

          Merci ,

          En effet erreur  la balise list style none elle était sur le mauvais  élement !

          Mais cela dit je ne comprends pas pourquoi cela met des listes a puce alors que je n'ai jamais demandé un code avec des puces 

          Si jamais vous avez une explication je suis prenante :)

          Merci à vouS:honte:

          -
          Edité par RoxanaPrado 23 avril 2019 à 20:13:45

          • Partager sur Facebook
          • Partager sur Twitter
            23 avril 2019 à 20:29:15

            Re,

            Tout simplement parce que <ul> est une liste, (Unordered List element)

            https://developer.mozilla.org/fr/docs/Web/HTML/Element/ul

            Donc par défaut tu as des puces.

            • Partager sur Facebook
            • Partager sur Twitter

            Compos sui.

              23 avril 2019 à 21:58:58

              Salut, 

              En plus de ce qui a été dit, je rajouterais qu'il n'y a aucun élément dans ton code HTML qui porte la classe "logo".

              Donc dans tous les cas ta propriété appliquée à ".main-nav .logo" ne pouvait rien donner... 😉 

              • Partager sur Facebook
              • Partager sur Twitter
              Recherche l'avis de développeurs front : Devenir un meilleur dev front ?
                27 avril 2019 à 17:40:56

                Merci de vos réponses mais je dois refaire mon code car le mentor me dit que ce n'est pas bon de mettre dans le menue mon logo du coup je dois tout refaire diffirement :( 

                • Partager sur Facebook
                • Partager sur Twitter
                  27 avril 2019 à 18:07:49

                  Bon courage dans ce cas ;)
                  • Partager sur Facebook
                  • Partager sur Twitter

                  Compos sui.

                  Alignement d menu et logo ok mais puce indésirable

                  × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                  • Editeur
                  • Markdown