Combiner les deux de la Police Impressionnant icônes
J'essaie de combiner les deux de la Police Impressionnant icônes, pour créer une pile. Je suis en train de fusionner fa-calendar
et fa-clock-o
icônes. Cela parce que, j'ai besoin d'une icône pour la date-heure.
Afin de les combiner entre eux, j'ai essayé ceci:
HTML
<span class="icon-stack">
<i class="fa fa-calendar icon-stack-3x"></i>
<i class="fa fa-clock-o icon-stack-1x"></i>
</span>
CSS
.icon-stack {
position: relative;
display: inline-block;
width: 2em;
height: 5em;
line-height: 4em;
vertical-align: middle;
}
.icon-stack-1x,
.icon-stack-2x,
.icon-stack-3x {
position: absolute;
left: 0;
width: 100%;
text-align: center;
}
.icon-stack-1x {
line-height: inherit;
}
.icon-stack-2x {
font-size: 1.5em;
}
.icon-stack-3x {
font-size: 2em;
}
C'est ce que je reçois comme un résultat.
Mais, je tiens à apporter un petit peu à droite. Je ne sais pas comment faire? Que puis-je faire pour apporter un peu vers la droite?
fontawesome.com/how-to-use/on-the-web/styling/stacking-icons et puis il suffit de jouer avec les propriétés left et top
OriginalL'auteur SSS | 2016-11-15
Vous devez vous connecter pour publier un commentaire.
Bien, comme vous l'avez fait de votre propre feuille de style CSS pour la position, il vous suffit de définir la
text-align
àright
, comme ceci:Voici un exemple de travail
Le problème est, que n'a pas l'air super. Donc, ici sont un couple de solutions de rechange dans le cas où ils sont de l'utiliser pour vous: Exemple 1, Exemple 2
Oui j'ai essayé mais le problème est qu'ils n'ont pas l'icône d'une horloge qui n'est pas transparent (qui est le problème). Pourquoi n'essayez-vous pas d'un calendrier différent? peut-être quelque chose comme ceci mais je n'ai pas utiliser la position absolue qui peut être difficile parfois, surtout avec les différents navigateurs. Vous pouvez essayer d'utiliser le haut-l'empilement des classes au lieu de cela, et faire simple comme ceci
Merci mec, pense que cela pourrait fonctionner. De toute façon merci.
OriginalL'auteur musefan