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.!! el 6 jun. 2020 a las 5:17

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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