Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
1
respuesta

Problemas con el FondoGradiente

Hola, estoy teniendo problemas con el FondoGradiente, estoy haciendo lo mismo que en la lección pero no se muestra el fondo como en el video.

import styled from "styled-components"
import GlobalStyle from "./components/GlobalStyles"

const FondoGradiente = styled.div`
background: linear-gradient(175deg, #041833 4.16%, #04244f 48%, #154580 96.76%);
width: 100%;
min-height: 100vh;
`

function App() {

  return (
    <>
      <FondoGradiente>
      <GlobalStyle></GlobalStyle>
      </FondoGradiente>
    </>
  )
}

export default App

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

1 respuesta
solución!

¡Hola Gerardo!

Después de revisar tu código, parece que has definido el componente FondoGradiente correctamente. Sin embargo, es posible que los estilos por defecto del navegador estén afectando la visualización del gradiente. Para solucionar esto, puedes utilizar la librería normalize para resetear los estilos por defecto del navegador y asegurarte de que el gradiente ocupe todo el ancho y alto de la página.

Puedes instalar la librería normalize utilizando npm:

npm install normalize.css

Una vez instalada, puedes importarla en tu proyecto y aplicarla para normalizar los estilos:

import "normalize.css";

Después de aplicar normalize, vuelve a cargar tu aplicación y deberías ver que el gradiente se muestra correctamente ocupando todo el espacio.

Espero haber ayudado y buenos estudios!