Dev Faq
0
votes

Flexbox SVG n'est pas inlincé d'autres éléments

J'essaie d'aligner SVG et peu d'éléments LI en ligne qui sont enveloppés par Flexbox Contener. CSS: 

.container{
    margin-left:20px;
    display:inline-flex;
    flex-direction: row;
    justify-content: left;
    flex-wrap: wrap;

}

.logo{
    width: auto;
    fill:orange;
    height: 57px;
}
.menu{

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: space-between;
}
.menu li {
    padding:30px;
    list-style: none;
}
.secondmenu{
    display:flex;
    flex-direction: row;
    justify-content: flex-end;
}

.secondmenu  svg{
    padding: 10px;

    width: 3%;
  }

0 commentaires

3 Réponses :

1
votes

Pour placer le menu entier dans une ligne:

Vous avez juste besoin de changer de votre .Container code> flex-wrap code> de wrap code > À Nowrap Code> P> 

<div class="container">
  <svg class="logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 99 58">
 <path d="M11.9 49.6c-2.1 0-4.2-.7-5.8-2.2A8.2 8.2 0 0 1 3 41.6c0-.2 0-.4-.1-.6V24.7s4.1 0 4.1 3.7v4.7l.6-.3c.1 0 .1-.1.1-.1.1 0 .2-.1.2-.1a8.2 8.2 0 0 1 4.2-1.1h.4c1.9.1 3.5.6 5 1.7 2.1 1.6 3.3 3.6 3.7 6 .3 2.1 0 4.1-1 5.8-1.5 2.5-3.5 4-6.2 4.5-.8 0-1.5.1-2.1.1zm.2-14.3c-.3 0-.6 0-.9.1-2.6.3-4.2 2.4-4.2 5v.4c0 1.5.6 2.7 1.7 3.6.9.8 2.2 1.3 3.4 1.3.9 0 1.9-.3 2.7-.7 1.9-1.1 2.7-2.9 2.4-5.2-.3-2.2-2.1-4.5-5.1-4.5zM69.1 49.6c-2.4 0-4.7-.9-6.5-2.7a8.78 8.78 0 0 1-2.7-6c-.1-2.5.7-4.9 2.5-6.7 1.8-1.8 4.1-2.9 6.7-2.9 5 0 9.2 4.1 9.2 9.1 0 2.4-.9 4.6-2.6 6.4a9.13 9.13 0 0 1-6.1 2.8h-.5zm.1-14.3c-.3 0-.6 0-1 .1a5.1 5.1 0 0 0-4.3 5.2v.4c.1 2.8 2.3 4.9 5.1 4.9.9 0 1.9-.3 2.7-.7 1.9-1.1 2.6-2.9 2.3-5.2-.1-2.5-2-4.7-4.8-4.7zM40.2 24.7v24.6h4.3V28.4c-.1-3.6-4.3-3.7-4.3-3.7zM46.4 24.7v24.6h4.3V28.4c0-3.9-4.3-3.7-4.3-3.7z"></path>
 <path d="M52.6 49.3v-2.7-6.4c0-1.4.1-2.9.7-4.4.9-2.1 2.5-3.3 4.7-4 1.8-.5 3.4-.4 3.4-.4v3.9s-1 0-2 .3c-1.4.4-2.3 1.3-2.5 2.8-.1.6-.2 1.4-.2 2.2v8.7h-4.1zM79.9 51.7c1.8 0 2.3.9 2.7 1.3.6.5 1.4.8 2.1.8 2.3 0 4.1-2.1 4.1-4.1v-.9c-1 .6-2.1.8-3.2.8-4.1 0-7.3-3.4-7.3-7.6V31.6h4.1v10.2c0 1.9 1.5 3.6 3.2 3.6 1.9 0 3.2-1.6 3.2-3.6v-6.5c0-3.7 4.1-3.7 4.1-3.7v18c0 4.2-3.1 8.1-8.2 8.1-3.1 0-5.9-1.8-7.1-4.7-.4-.8-.5-1.4-.5-1.4s1.3.1 2.8.1zM30.3 45.9c-1.7 0-3.1-.8-4-2l13-4.6c-.6-3-1.8-4.9-3.6-6.2a9.3 9.3 0 0 0-7-1.5c-.6.1-1 .2-1.6.4a8.96 8.96 0 0 0-5.8 9.3 9 9 0 0 0 3.2 6.2c1.8 1.5 4 2.2 6.3 2.2 1 0 1.9-.2 2.9-.6 3.7-1.3 5.4-4.1 5.8-6.7h-2.4c-1.5 0-2.1 1-2.5 1.4a5.94 5.94 0 0 1-4.3 2.1zm-1.7-10.3c.1 0 .1 0 .2-.1H29.1c.4-.1.8-.2 1.3-.2.9 0 1.8.3 2.6.7.4.2.7.5 1 .8V37.1l.4.4-9.2 3.2v-.5c.1-2.2 1.4-3.9 3.4-4.6zM75.6 5.5c-.7 0-1.3.6-1.3 1.3 0 .7.7 1.4 1.5 1.2.3 1.1.9 2.1 1.8 2.8l.4.2.4-.3c.7-.6 1.4-1.7 1.7-2.8h.3c.7 0 1.3-.6 1.3-1.3s-.7-1.2-1.4-1.2c-.8 0-1.3.6-1.3 1.3 0 .9-.5 2.1-1.1 2.9-.6-.7-1-1.8-1.1-2.9.1-.6-.5-1.2-1.2-1.2zm16.5 11.6c-2.5-6.2-6.1-8-7.6-8.6.1-.4.1-.7.1-1.2 0-3.6-3-6.5-6.6-6.5-3.5 0-6.3 2.8-6.8 6.4-.7 8.7 5 13.5 7.8 15.7 1.6 1.2 2.4 2.1 1.5 3.6-.6.8-1.2 2-1.8 2.2-1.6.3-2.1 1.3-2.1 1.3H78c1.8 0 2.3-.1 4.1-3 1.7-2.9-1-4.5-2.1-5.4-2.8-2.1-8-6.4-7.3-14.2v-.1c.3-3 2.5-5.2 5.4-5.2a5.16 5.16 0 0 1 3.7 8.8c-.9 1-2.2 1.5-3.6 1.5-.5 0-.9-.1-1.3-.2-1.4-.4-2 .6-2 .6l-.1.1.1.1c.9.6 2.2.9 3.3.9 1.8 0 3.4-.6 4.6-1.9.6-.6 1.1-1.3 1.4-2 1.2.5 4.4 2.1 6.7 7.7.6 1.4 1.1 2.8 1.6 4-1.8 0-8.1-.2-11.2-5.1-.8-1.3-2.1-1-2.1-1 3.2 7.7 12.3 7.5 14 7.6.8 2 1.5 3.6 1.8 4.5-.7 0-2.1-.3-3.7-1.7a7.11 7.11 0 0 0-5.1-1.9l-4 6.3s1.9 0 2.7-1.2l2.2-3.5c1.1.1 2.2.6 3.3 1.5 2.1 1.7 3.4 1.9 4.7 1.9 1.2.1 1.9-.3 1.9-.3s-2.4-5.6-4.9-11.7z"></path>
 </svg>
  <div class="menu">

    <li>
      <a>
    <span>SHOP</span>
</a>

    </li>
    <li>
      <a>
    <span>BUNDLES</span>
</a>
    </li>
    <li>
      <a>
    <span>EXPLORE</span>
    </a>
    </li>


  </div>




  <nav class="secondmenu">
    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 31 27" xml="preserve">
							<path  d="M15.5,26.8c-0.4,0-0.8-0.2-1.1-0.6C13.1,24.1,6.7,14,6.7,9.5c-0.1-5,3.8-9.1,8.8-9.3c1.1,0,2.2,0.2,3.2,0.7
								L19.1,1c0.6,0.3,1.1,0.6,1.6,1l0.3,0.3c0.3,0.2,0.5,0.5,0.8,0.8c0.4,0.4,0.7,0.9,1,1.4L23,4.7c0.1,0.1,0.1,0.3,0.2,0.4
								s0.1,0.3,0.2,0.4l0.2,0.4l0.2,0.4c0.1,0.3,0.2,0.6,0.2,0.9s0.1,0.3,0.1,0.4c0.1,0.5,0.2,1.1,0.2,1.6l0,0v0.3c0,1.2-0.3,2.4-0.7,3.5
								c-0.2,0.5-0.4,1.1-0.6,1.6c-0.1,0.3-0.3,0.7-0.5,1l-0.3,0.7L21.8,17l-0.3,0.7c-0.4,0.7-0.7,1.4-1.1,2c-0.2,0.4-0.5,0.9-0.7,1.3
								L19,22.2l-0.3,0.6c-1.2,2-2,3.3-2.1,3.4C16.4,26.6,16,26.8,15.5,26.8L15.5,26.8z M15.5,2.8c-3.6,0.1-6.3,3.1-6.2,6.7
								c0,2.7,3.6,9.4,6.2,13.6l1-1.6l0.3-0.5c0.2-0.4,0.5-0.8,0.7-1.2s0.5-0.8,0.7-1.2c0.4-0.7,0.7-1.3,1-2c0.1-0.2,0.2-0.4,0.3-0.7
								l0.3-0.7l0.3-0.6c0.1-0.3,0.3-0.6,0.4-1c0.2-0.5,0.4-1,0.6-1.5c0.3-0.9,0.6-1.8,0.6-2.7V9.3c0-0.4,0-0.8-0.1-1.2
								c0-0.1,0-0.2-0.1-0.3s-0.1-0.4-0.2-0.6l-0.1-0.3c0-0.1-0.1-0.2-0.1-0.3S21,6.4,21,6.3S20.9,6.1,20.8,6l-0.1-0.1
								c-0.2-0.4-0.5-0.7-0.7-1c-0.2-0.2-0.4-0.4-0.5-0.6l-0.2-0.2c-0.4-0.3-0.8-0.5-1.2-0.8l-0.3-0.1C17,2.9,16.3,2.8,15.5,2.8z
								 M15.5,13.4c-2.6-0.1-4.6-2.2-4.6-4.8c0,0,0,0,0,0c-0.1-2.6,2-4.7,4.5-4.8l0,0c2.6,0,4.7,2.2,4.7,4.8c0,0,0,0,0,0
								C20.1,11.1,18.1,13.3,15.5,13.4L15.5,13.4z M15.5,6.4c-1.2,0.1-2,1.1-2,2.2c-0.1,1.2,0.8,2.2,2,2.2c1.2-0.1,2.1-1.1,2-2.2
								C17.6,7.4,16.7,6.4,15.5,6.4C15.5,6.3,15.5,6.3,15.5,6.4L15.5,6.4z"></path>
							</svg>







    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 31 27" xml="preserve">
							<path  d="M15.3,15.7c-0.3,0-0.5-0.1-0.8-0.2L2,6.5C1.4,6.1,1.3,5.3,1.7,4.7S2.9,4,3.5,4.4l11.9,8.5l12.1-8.5
								C28,4,28.8,4.1,29.2,4.7c0.4,0.6,0.3,1.4-0.3,1.8l0,0l-12.8,9C15.9,15.6,15.6,15.7,15.3,15.7z"></path>
							<path  d="M27.3,6.3c0.1,0,0.1,0.1,0.1,0.1V21c0,0.1-0.1,0.1-0.1,0.1H3.7c-0.1,0-0.1-0.1-0.1-0.1V6.5
								c0-0.1,0.1-0.1,0.1-0.1H27.3 M27.3,3.8H3.7C2.2,3.8,1,5,1,6.5V21c0,1.5,1.2,2.7,2.7,2.7h23.6c1.5,0,2.7-1.2,2.7-2.7V6.5
								C30,5,28.8,3.8,27.3,3.8L27.3,3.8z"></path>
							</svg>






    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 31 27" xml="preserve">
							<path  d="M8.1,16.6c3,3,7.9,3,11,0s3-7.9,0-11s-7.9-3-11,0c-1.4,1.5-2.3,3.4-2.3,5.5C5.8,13.2,6.6,15.2,8.1,16.6z
							 M27.8,23.5c0.5,0.5,0.5,1.3,0,1.8c0,0,0,0,0,0c-0.5,0.5-1.3,0.5-1.8,0c0,0,0,0,0,0l-6-6c-4.5,3.5-11,2.7-14.6-1.8
							c-1.4-1.8-2.2-4.1-2.2-6.5c0-5.7,4.6-10.4,10.4-10.4C19.3,0.8,24,5.4,24,11.1c0,2.3-0.8,4.5-2.2,6.4L27.8,23.5z"></path>
						</svg>











    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 31 27" xml="preserve">
								<path  d="M24,18.8H10.3c-0.6,0-1.1-0.4-1.3-0.9L5.5,6.1L5.1,4.8c-0.3-1-1.1-1.6-2.1-1.7H1.3C0.6,3.2,0,2.7-0.1,2
									s0.5-1.3,1.2-1.4c0.1,0,0.2,0,0.2,0h1.6c2.1,0,3.9,1.4,4.6,3.4L8,5.2l0.3,1h21c0.4,0,0.7,0.1,0.9,0.4c0.3,0.3,0.4,0.6,0.3,1L30,14
									C29.6,16.9,27,19,24,18.8z M11.2,16.3H24c3.1,0,3.4-2.4,3.5-2.5l0.4-4.9H9L11.2,16.3z"></path>
								<path  d="M13.6,27c-1.8,0-3.2-1.4-3.2-3.2c0-1.8,1.4-3.2,3.2-3.2s3.2,1.4,3.2,3.2c0,0,0,0,0,0C16.7,25.6,15.3,27,13.6,27
									C13.6,27,13.6,27,13.6,27z M13.6,23.2c-0.3,0-0.6,0.3-0.6,0.6c0,0.3,0.3,0.6,0.6,0.6c0.3,0,0.6-0.3,0.6-0.6c0,0,0,0,0,0
									C14.2,23.5,13.9,23.2,13.6,23.2z"></path>
								<path  d="M25.3,27c-1.8,0-3.2-1.4-3.2-3.1c0-1.8,1.4-3.2,3.1-3.2c1.8,0,3.2,1.4,3.2,3.1c0,0,0,0,0,0
									C28.4,25.6,27,27,25.3,27z M25.3,23.2c-0.3,0-0.6,0.3-0.6,0.6c0,0,0,0,0,0c0,0.3,0.3,0.6,0.6,0.6s0.6-0.3,0.6-0.6
									C25.9,23.5,25.6,23.2,25.3,23.2z"></path>
							</svg>







  </nav>


</div>

2 commentaires

ils ne sont pas logo inlined et menu sont maintenant de taille plus petite ??

Vous pouvez corriger cet ajout d'une largeur fixe à .Logo et .secondmenu svg , j'ai mis à jour ma réponse

1
votes

Vous allez ici Lastpeony4 Nettoyé votre code un peu cela devrait vous aider à démarrer. https://codepen.io/anon/pen/xmewbo?editors=1100 

.container{
    margin-left:20px;
    display:flex;
    flex-direction: row;
}
.logo{
    width: auto;
    fill:orange;
    height: 57px;
}

a {
  text-decoration: none;
  color: inherit;
}

ul {
  list-style: none;
  display: flex;
  flex-grow: 1;

}

ul li {
  padding: 1rem
}

.svg-container {
  display: flex;
}

.svg-container svg {
  height: 20px;
    padding: 1.8rem 1rem;
}

3 commentaires

Bonjour Et si je fais une police plus grande comment les aligner à nouveau en ligne? parce que par exemple si j'ajoute que les fontiches au menu UL diminue légèrement

Vous pouvez ajuster le rembourrage sur .svg-conteneur SVG ... La hauteur contrôle la taille de l'icône et le remplissage 1.8rem (haut et inférieur) 1rem (gauche et bas) 1rem (gauche et droite) Si vous en avez besoin de se rapprocher afin que vous puissiez mieux Alignez-les simplement sur Flex-Grow: 1; Sur l'UL jusqu'à ce que vous soyez satisfait, laissez-moi savoir si vous avez besoin de quelque chose d'autre. Merci pour la marque de réponse

De plus, si vous souhaitez vous débarrasser du rembourrage, consultez Aligner les éléments et justifier le contenu de Flexbox. Ensuite, vous auriez besoin de fournir votre conteneur UL et SVG avec une sorte de largeur et de hauteur (min-largeur / min-hauteur ou simplement de largeur / hauteur) puis alignez les éléments du centre et justifier l'espace de contenu autour / espace entre

1
votes

Votre problème principal se produit à cause de vos paramètres de la zone de vie de votre SVGS. Vous devez toujours spécifier la fenêtre (largeur et hauteur) de votre SVG lors de l'utilisation de la vue. Ces paramètres doivent vraiment être joués avec pour obtenir le bon effet que vous recherchez. J'ai supprimé vos paramètres de largeur de 3% de largeur et de rembourrage sur vos deuxième éléments de menu car ils interférent également avec votre boîte de vie.

Pour votre conteneur Flexbox, j'ai changé l'affichage sur Flex au lieu de Inline-Flex, puis définissez votre menu Seconds NAV sur Margin-Gauche de Auto - Cela le conserve à droite de l'écran. P>

Exécutez l'extrait et développez-le pour voir la deuxième ligne de menus de votre choix. Étant donné que vos icônes sont d'une largeur fixe, réglez le conteneur sur Flex-Wrap: Nowrap conservera vos éléments d'emballage, mais votre icône principale se rétrécira sur des écrans plus petits. p>

p> 

<div class="container">
  <svg class="logo" xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="2 -10 100 100">
 <path d="M11.9 49.6c-2.1 0-4.2-.7-5.8-2.2A8.2 8.2 0 0 1 3 41.6c0-.2 0-.4-.1-.6V24.7s4.1 0 4.1 3.7v4.7l.6-.3c.1 0 .1-.1.1-.1.1 0 .2-.1.2-.1a8.2 8.2 0 0 1 4.2-1.1h.4c1.9.1 3.5.6 5 1.7 2.1 1.6 3.3 3.6 3.7 6 .3 2.1 0 4.1-1 5.8-1.5 2.5-3.5 4-6.2 4.5-.8 0-1.5.1-2.1.1zm.2-14.3c-.3 0-.6 0-.9.1-2.6.3-4.2 2.4-4.2 5v.4c0 1.5.6 2.7 1.7 3.6.9.8 2.2 1.3 3.4 1.3.9 0 1.9-.3 2.7-.7 1.9-1.1 2.7-2.9 2.4-5.2-.3-2.2-2.1-4.5-5.1-4.5zM69.1 49.6c-2.4 0-4.7-.9-6.5-2.7a8.78 8.78 0 0 1-2.7-6c-.1-2.5.7-4.9 2.5-6.7 1.8-1.8 4.1-2.9 6.7-2.9 5 0 9.2 4.1 9.2 9.1 0 2.4-.9 4.6-2.6 6.4a9.13 9.13 0 0 1-6.1 2.8h-.5zm.1-14.3c-.3 0-.6 0-1 .1a5.1 5.1 0 0 0-4.3 5.2v.4c.1 2.8 2.3 4.9 5.1 4.9.9 0 1.9-.3 2.7-.7 1.9-1.1 2.6-2.9 2.3-5.2-.1-2.5-2-4.7-4.8-4.7zM40.2 24.7v24.6h4.3V28.4c-.1-3.6-4.3-3.7-4.3-3.7zM46.4 24.7v24.6h4.3V28.4c0-3.9-4.3-3.7-4.3-3.7z"></path>
 <path d="M52.6 49.3v-2.7-6.4c0-1.4.1-2.9.7-4.4.9-2.1 2.5-3.3 4.7-4 1.8-.5 3.4-.4 3.4-.4v3.9s-1 0-2 .3c-1.4.4-2.3 1.3-2.5 2.8-.1.6-.2 1.4-.2 2.2v8.7h-4.1zM79.9 51.7c1.8 0 2.3.9 2.7 1.3.6.5 1.4.8 2.1.8 2.3 0 4.1-2.1 4.1-4.1v-.9c-1 .6-2.1.8-3.2.8-4.1 0-7.3-3.4-7.3-7.6V31.6h4.1v10.2c0 1.9 1.5 3.6 3.2 3.6 1.9 0 3.2-1.6 3.2-3.6v-6.5c0-3.7 4.1-3.7 4.1-3.7v18c0 4.2-3.1 8.1-8.2 8.1-3.1 0-5.9-1.8-7.1-4.7-.4-.8-.5-1.4-.5-1.4s1.3.1 2.8.1zM30.3 45.9c-1.7 0-3.1-.8-4-2l13-4.6c-.6-3-1.8-4.9-3.6-6.2a9.3 9.3 0 0 0-7-1.5c-.6.1-1 .2-1.6.4a8.96 8.96 0 0 0-5.8 9.3 9 9 0 0 0 3.2 6.2c1.8 1.5 4 2.2 6.3 2.2 1 0 1.9-.2 2.9-.6 3.7-1.3 5.4-4.1 5.8-6.7h-2.4c-1.5 0-2.1 1-2.5 1.4a5.94 5.94 0 0 1-4.3 2.1zm-1.7-10.3c.1 0 .1 0 .2-.1H29.1c.4-.1.8-.2 1.3-.2.9 0 1.8.3 2.6.7.4.2.7.5 1 .8V37.1l.4.4-9.2 3.2v-.5c.1-2.2 1.4-3.9 3.4-4.6zM75.6 5.5c-.7 0-1.3.6-1.3 1.3 0 .7.7 1.4 1.5 1.2.3 1.1.9 2.1 1.8 2.8l.4.2.4-.3c.7-.6 1.4-1.7 1.7-2.8h.3c.7 0 1.3-.6 1.3-1.3s-.7-1.2-1.4-1.2c-.8 0-1.3.6-1.3 1.3 0 .9-.5 2.1-1.1 2.9-.6-.7-1-1.8-1.1-2.9.1-.6-.5-1.2-1.2-1.2zm16.5 11.6c-2.5-6.2-6.1-8-7.6-8.6.1-.4.1-.7.1-1.2 0-3.6-3-6.5-6.6-6.5-3.5 0-6.3 2.8-6.8 6.4-.7 8.7 5 13.5 7.8 15.7 1.6 1.2 2.4 2.1 1.5 3.6-.6.8-1.2 2-1.8 2.2-1.6.3-2.1 1.3-2.1 1.3H78c1.8 0 2.3-.1 4.1-3 1.7-2.9-1-4.5-2.1-5.4-2.8-2.1-8-6.4-7.3-14.2v-.1c.3-3 2.5-5.2 5.4-5.2a5.16 5.16 0 0 1 3.7 8.8c-.9 1-2.2 1.5-3.6 1.5-.5 0-.9-.1-1.3-.2-1.4-.4-2 .6-2 .6l-.1.1.1.1c.9.6 2.2.9 3.3.9 1.8 0 3.4-.6 4.6-1.9.6-.6 1.1-1.3 1.4-2 1.2.5 4.4 2.1 6.7 7.7.6 1.4 1.1 2.8 1.6 4-1.8 0-8.1-.2-11.2-5.1-.8-1.3-2.1-1-2.1-1 3.2 7.7 12.3 7.5 14 7.6.8 2 1.5 3.6 1.8 4.5-.7 0-2.1-.3-3.7-1.7a7.11 7.11 0 0 0-5.1-1.9l-4 6.3s1.9 0 2.7-1.2l2.2-3.5c1.1.1 2.2.6 3.3 1.5 2.1 1.7 3.4 1.9 4.7 1.9 1.2.1 1.9-.3 1.9-.3s-2.4-5.6-4.9-11.7z"></path>
 </svg>
  <div class="menu">

    <li>
      <a>
        <span>SHOP</span>
      </a>

    </li>
    <li>
      <a>
        <span>BUNDLES</span>
      </a>
    </li>
    <li>
      <a>
        <span>EXPLORE</span>
      </a>
    </li>


  </div>


  <nav class="secondmenu">
    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xlink" x="0px" y="0px" width="50" height="50" viewBox="0 0 50 50" xml="preserve">
							<path  d="M15.5,26.8c-0.4,0-0.8-0.2-1.1-0.6C13.1,24.1,6.7,14,6.7,9.5c-0.1-5,3.8-9.1,8.8-9.3c1.1,0,2.2,0.2,3.2,0.7
								L19.1,1c0.6,0.3,1.1,0.6,1.6,1l0.3,0.3c0.3,0.2,0.5,0.5,0.8,0.8c0.4,0.4,0.7,0.9,1,1.4L23,4.7c0.1,0.1,0.1,0.3,0.2,0.4
								s0.1,0.3,0.2,0.4l0.2,0.4l0.2,0.4c0.1,0.3,0.2,0.6,0.2,0.9s0.1,0.3,0.1,0.4c0.1,0.5,0.2,1.1,0.2,1.6l0,0v0.3c0,1.2-0.3,2.4-0.7,3.5
								c-0.2,0.5-0.4,1.1-0.6,1.6c-0.1,0.3-0.3,0.7-0.5,1l-0.3,0.7L21.8,17l-0.3,0.7c-0.4,0.7-0.7,1.4-1.1,2c-0.2,0.4-0.5,0.9-0.7,1.3
								L19,22.2l-0.3,0.6c-1.2,2-2,3.3-2.1,3.4C16.4,26.6,16,26.8,15.5,26.8L15.5,26.8z M15.5,2.8c-3.6,0.1-6.3,3.1-6.2,6.7
								c0,2.7,3.6,9.4,6.2,13.6l1-1.6l0.3-0.5c0.2-0.4,0.5-0.8,0.7-1.2s0.5-0.8,0.7-1.2c0.4-0.7,0.7-1.3,1-2c0.1-0.2,0.2-0.4,0.3-0.7
								l0.3-0.7l0.3-0.6c0.1-0.3,0.3-0.6,0.4-1c0.2-0.5,0.4-1,0.6-1.5c0.3-0.9,0.6-1.8,0.6-2.7V9.3c0-0.4,0-0.8-0.1-1.2
								c0-0.1,0-0.2-0.1-0.3s-0.1-0.4-0.2-0.6l-0.1-0.3c0-0.1-0.1-0.2-0.1-0.3S21,6.4,21,6.3S20.9,6.1,20.8,6l-0.1-0.1
								c-0.2-0.4-0.5-0.7-0.7-1c-0.2-0.2-0.4-0.4-0.5-0.6l-0.2-0.2c-0.4-0.3-0.8-0.5-1.2-0.8l-0.3-0.1C17,2.9,16.3,2.8,15.5,2.8z
								 M15.5,13.4c-2.6-0.1-4.6-2.2-4.6-4.8c0,0,0,0,0,0c-0.1-2.6,2-4.7,4.5-4.8l0,0c2.6,0,4.7,2.2,4.7,4.8c0,0,0,0,0,0
								C20.1,11.1,18.1,13.3,15.5,13.4L15.5,13.4z M15.5,6.4c-1.2,0.1-2,1.1-2,2.2c-0.1,1.2,0.8,2.2,2,2.2c1.2-0.1,2.1-1.1,2-2.2
								C17.6,7.4,16.7,6.4,15.5,6.4C15.5,6.3,15.5,6.3,15.5,6.4L15.5,6.4z"></path>
							</svg>







    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xlink" x="0px" y="0px" width="50" height="50" viewBox="0 0 50 50" xml="preserve">
							<path  d="M15.3,15.7c-0.3,0-0.5-0.1-0.8-0.2L2,6.5C1.4,6.1,1.3,5.3,1.7,4.7S2.9,4,3.5,4.4l11.9,8.5l12.1-8.5
								C28,4,28.8,4.1,29.2,4.7c0.4,0.6,0.3,1.4-0.3,1.8l0,0l-12.8,9C15.9,15.6,15.6,15.7,15.3,15.7z"></path>
							<path  d="M27.3,6.3c0.1,0,0.1,0.1,0.1,0.1V21c0,0.1-0.1,0.1-0.1,0.1H3.7c-0.1,0-0.1-0.1-0.1-0.1V6.5
								c0-0.1,0.1-0.1,0.1-0.1H27.3 M27.3,3.8H3.7C2.2,3.8,1,5,1,6.5V21c0,1.5,1.2,2.7,2.7,2.7h23.6c1.5,0,2.7-1.2,2.7-2.7V6.5
								C30,5,28.8,3.8,27.3,3.8L27.3,3.8z"></path>
							</svg>






    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xlink" x="0px" y="0px" width="50" height="50" viewBox="0 0 50 50" xml="preserve">
							<path  d="M8.1,16.6c3,3,7.9,3,11,0s3-7.9,0-11s-7.9-3-11,0c-1.4,1.5-2.3,3.4-2.3,5.5C5.8,13.2,6.6,15.2,8.1,16.6z
							 M27.8,23.5c0.5,0.5,0.5,1.3,0,1.8c0,0,0,0,0,0c-0.5,0.5-1.3,0.5-1.8,0c0,0,0,0,0,0l-6-6c-4.5,3.5-11,2.7-14.6-1.8
							c-1.4-1.8-2.2-4.1-2.2-6.5c0-5.7,4.6-10.4,10.4-10.4C19.3,0.8,24,5.4,24,11.1c0,2.3-0.8,4.5-2.2,6.4L27.8,23.5z"></path>
						</svg>











    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xlink" x="0px" y="0px" width="50" height="50" viewBox="0 0 50 50" xml="preserve">
								<path  d="M24,18.8H10.3c-0.6,0-1.1-0.4-1.3-0.9L5.5,6.1L5.1,4.8c-0.3-1-1.1-1.6-2.1-1.7H1.3C0.6,3.2,0,2.7-0.1,2
									s0.5-1.3,1.2-1.4c0.1,0,0.2,0,0.2,0h1.6c2.1,0,3.9,1.4,4.6,3.4L8,5.2l0.3,1h21c0.4,0,0.7,0.1,0.9,0.4c0.3,0.3,0.4,0.6,0.3,1L30,14
									C29.6,16.9,27,19,24,18.8z M11.2,16.3H24c3.1,0,3.4-2.4,3.5-2.5l0.4-4.9H9L11.2,16.3z"></path>
								<path  d="M13.6,27c-1.8,0-3.2-1.4-3.2-3.2c0-1.8,1.4-3.2,3.2-3.2s3.2,1.4,3.2,3.2c0,0,0,0,0,0C16.7,25.6,15.3,27,13.6,27
									C13.6,27,13.6,27,13.6,27z M13.6,23.2c-0.3,0-0.6,0.3-0.6,0.6c0,0.3,0.3,0.6,0.6,0.6c0.3,0,0.6-0.3,0.6-0.6c0,0,0,0,0,0
									C14.2,23.5,13.9,23.2,13.6,23.2z"></path>
								<path  d="M25.3,27c-1.8,0-3.2-1.4-3.2-3.1c0-1.8,1.4-3.2,3.1-3.2c1.8,0,3.2,1.4,3.2,3.1c0,0,0,0,0,0
									C28.4,25.6,27,27,25.3,27z M25.3,23.2c-0.3,0-0.6,0.3-0.6,0.6c0,0,0,0,0,0c0,0.3,0.3,0.6,0.6,0.6s0.6-0.3,0.6-0.6
									C25.9,23.5,25.6,23.2,25.3,23.2z"></path>
							</svg>







  </nav>

</div>

0 commentaires

Articles qui pourrait vous intéresser :

Google Chrome Uncaught (promis) DOMException lors de la lecture AUDIO
Select2 ne s'affiche pas correctement dans le mode bootstrap
Le bootstrap de Twitter a-t-il des classes utilitaires de taille de police?
Comment puis-je définir un format pour les nombres d'entrée dans Blazor