0

estoy usando font-awesome y sus iconos deseo crear algo así:

awe

tengo el siguiente código:

    <i class="fa fa-cube fa-2x"></i>
    <i class="fa fa-plus" style="margin-top: 14px; margin-left:-1px;"></i>

el resultado obtenido:

introducir la descripción de la imagen aquí

No se como puedo alinearlo como la primera imagen y un border-radius, quiza alguna sugerencia. Gracias

1 respuesta 1

0

Usando Stacked icons, podrías hacerlo así:

.fa {
  color: #706f6f;
}
.fa-stack-rounded {
  border: 6px solid #706f6f;
  background-color: #fff;
  border-radius: 50%;
  transform: translate(25%, 25%) scale(0.5);
  box-shadow: 0px 0px 0px 8px #fff;
}
<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
<span class="fa-stack fa-3x">
  <i class="fa fa-cube fa-stack-2x"></i>
  <i class="fa fa-plus fa-stack-1x fa-stack-rounded"></i>
</span>

1
  • genial gracias.!! Commented el 6 jun. 2020 a las 5:17

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.