Experimental browser for the Atmosphere
¡Ojo con `vh` en CSS! En móviles no tiene en cuenta la desaparición de las barras de herramientas. La solución es `dvh`: se adapta siempre a la altura real de la ventana. Así, tu diseño aprovecha todo el espacio disponible, evita cortes y mejora la UX.
May 9, 2025, 1:53 PM
{
"text": "¡Ojo con `vh` en CSS! En móviles no tiene en cuenta la desaparición de las barras de herramientas.\n\nLa solución es `dvh`: se adapta siempre a la altura real de la ventana. Así, tu diseño aprovecha todo el espacio disponible, evita cortes y mejora la UX.",
"$type": "app.bsky.feed.post",
"embed": {
"$type": "app.bsky.embed.images",
"images": [
{
"alt": "Ilustración comparativa de cinco mockups de móvil: tres a la izquierda con height: 100vh donde un fondo azul queda cortado y se cuela bajo las barras de herramientas, y dos a la derecha con height: 100dvh donde un fondo amarillo encaja perfectamente al tamaño real de la ventana visible (adiós trozos de fondo rebeldes que intentan escaparse).",
"image": {
"$type": "blob",
"ref": {
"$link": "bafkreih6ne43pfma7k6xnl3x4wsvaycdc2pzpfuxhsw2daek5yrews7atq"
},
"mimeType": "image/jpeg",
"size": 194820
},
"aspectRatio": {
"width": 3000,
"height": 1688
}
}
]
},
"langs": [
"es"
],
"createdAt": "2025-05-09T13:53:30.228Z"
}