<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0,user-scalable=yes">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" crossorigin="anonymous">
<style>
.social-menu a {
display: block;
width: 36px;
height: 36px;
background: #2d2d2d;
border-radius: 99px;
color: #fff;
position: relative;
-webkit-font-smoothing: antialiased;
}
.social-menu a:hover {
background: #3bc492;
color: #fff;
}
.social-menu li a::before {
content: '\f408';
font-family: 'fontAwesome';
display: inline-block;
font-size: 16px;
text-align: center;
position: absolute;
top: 50%;
margin-top: -8px;
left: 0;
right: 0;
}
.wp-is-mobile .social-menu li a::before { margin-top: -7px; }
.social-menu li a[href*="codepen.io"]::before { content: '\f1cb'; }
.social-menu li a[href*="dribbble.com"]::before { content: '\f17d'; }
.social-menu li a[href*="facebook.com"]::before { content: '\f09a'; }
.social-menu li a[href*="flickr.com"]::before { content: '\f16e'; }
.social-menu li a[href*="github.com"]::before { content: '\f09b'; }
.social-menu li a[href*="instagram.com"]::before { content: '\f16d'; }
.social-menu li a[href*="linkedin.com"]::before { content: '\f0e1'; }
.social-menu li a[href*="pinterest.com"]::before { content: '\f0d2'; }
.social-menu li a[href*="plus.google.com"]::before { content: '\f0d5'; }
.social-menu li a[href*="soundcloud.com"]::before { content: '\f1be'; }
.social-menu li a[href*="tumblr.com"]::before { content: '\f173'; }
.social-menu li a[href*="twitter.com"]::before { content: '\f099'; }
.social-menu li a[href*="vimeo.com"]::before { content: '\f194'; }
.social-menu li a[href*="wordpress.org"]::before,
.social-menu li a[href*="wordpress.com"]::before { content: '\f19a'; }
.social-menu li a[href*="youtube.com"]::before { content: '\f167'; }
.social-menu li a[href*="mailto"]::before { content: '\f0e0'; }
</style>
</head>
<body>
<ul class="social-menu">
<li><a href="codepen.io"></a></li>
<li><a href="dribbble.com"></a></li>
<li><a href="facebook.com"></a></li>
<li><a href="flickr.com"></a></li>
<li><a href="github.com"></a></li>
<li><a href="instagram.com"></a></li>
<li><a href="linkedin.com"></a></li>
<li><a href="pinterest.com"></a></li>
<li><a href="plus.google.com"></a></li>
<li><a href="soundcloud.com"></a></li>
<li><a href="tumblr.com"></a></li>
<li><a href="twitter.com"></a></li>
<li><a href="vimeo.com"></a></li>
<li><a href="wordpress.com"></a></li>
<li><a href="youtube.com"></a></li>
<li><a href="mailto"></a></li>
</ul>
</body>
</html>
.sp-module ul.menugestion-tableau-bord ul > li > a {
text-decoration: underline;
line-height: 1rem!important;
display: inline!important;
}
.sp-module ul.menugestion-tableau-bord ul > li:before {
content:"> ";
}
.sp-module ul.menugestion-tableau-bord ul > li > a:visited {
text-decoration: underline;
color:green;
/* text-decoration: underline overline #FF3028; */
}
.sp-module ul.menugestion-tableau-bord ul > li > a:hover{
text-decoration: #a00 wavy underline;
color: #a00;
}
.menugestion-tableau-bord span.nav-header {
font-size:1.5rem;
padding: 0rem 0rem 0rem 1.2rem;
font-weight : 800;
}
HDcms a écrit :
Bonjour
c'est exactement ce que j'avai mis (voir en commentaire dans mon code. désolé oublié de l'enlever!).
j'ai réessayai et même retour à la ligne
@+
HDcms a écrit :
Voic imon code au cas ou j'ai fais encore une erreur bête, sinon si qq peut me donner d'autres pistes.
/*.sp-module ul.menugestion-tableau-bord ul > li:before { */ .sp-module ul.menugestion-tableau-bord ul > li > a:before { content: "> "; }
.sp-module ul.menugestion-tableau-bord ul > li:before {
content: ">";
}/*.sp-module ul.menugestion-tableau-bord ul > li:before { */
.sp-module ul.menugestion-tableau-bord ul > li > a:before {
content: "> ";
}Luchis a écrit :
Bonjour Parsimonhi,
Et merci encore pour ton temps.
Autant pou moi, je n'avais pas bien compris ta question : pas de soucis du côté de l'affichage des FontAwesome sur une page html externe. Je viens de tester pour le font-family, sans succès ...
Un div unique, c'est plus sobre, disons plus classe. Mais deux, c'est évidemment plus convivial, ils s'ennnuient moins
(Hulk Hogan)
