Ir a un anchor/punto de ancla con un margen superior personalizado

A veces cuando nos queremos mover a un punto de «ancla» nos puede surgir un problema en el caso que tengamos, por ejemplo, un navbar.
¿Por qué? Porque HTML no reconoce si tiene una capa que le tape cierto contenido o no. Para solucionar esto tenemos una propiedad en css llamada scroll-margin-top, y le podemos pasar los píxeles de margen que queremos respecto a la parte superior.

#elemento{
    scroll-margin-top: 72px;
}

Podemos ver el ejemplo en Codepen:

See the Pen
Scroll to Anchor with margin top
by Kike (@kikebeltran)
on CodePen.


Tu opinión es importante para mi, ¿Te ha resultado útil este artículo?

¿Eres programador/a?

En Pulpo están buscando nuevos talentos, envíales un email a developers@pulpoapp.com.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*