0

tengo el siguiente problema, tengo establecido una foto en resolucion 1440x900 como background de mi pagina web, el problema es que tiene unos margenes en blanco que no se como quitarlos, quiero que la foto cubra absolutamente toda la pantalla.

-codigo de app.html(donde declaro el fondo de pantalla para empezar a escribir)(el app-header es la nav-bar con los botones que esos si quiero que tengan su propio fondo a color como ya esta puesto) introducir la descripción de la imagen aquí

-codigo del app.css donde tengo establecido el fondo de pantallaintroducir la descripción de la imagen aquí

-asi se ve mi pagina, donde tambien se puede ver los bordes blancos alrededor de mi fondo que quiero quitar. introducir la descripción de la imagen aquí

4
  • Agrega tu código HTML y tú regla css como texto por favor
    – user128299
    Commented el 23 jul. 2020 a las 3:29
  • Bienvenido a StackOverflow. Por favor considera hacer el recorrido donde aprenderás sobre el funcionamiento del sitio y ganarás tu primera medalla. Para mejorar tus oportunidades de obtener una respuesta, agrega tu código en texto como lo sugiere @BetaM y no en imagenes. Commented el 23 jul. 2020 a las 3:54
  • Utilizas un reset en el css? Si no lo utilizas por favor prueba body{margin:0;padding:0}
    – enxaneta
    Commented el 23 jul. 2020 a las 10:08
  • @enxaneta no se a que te refieres con reset, pero dentro del css de app ingrese lo que me dijiste, y arreglo el margen derecho, en el izquierdo sigue un espacio en blanco y arriba, abajo tambien Commented el 24 jul. 2020 a las 0:35

2 respuestas 2

1

Buenas noches
Lo que puedes intentar seria lo siguiente:

app.component.html
Borrar el div con el nombre background y dejar solo el componente header

<app-header></app-header>

En los estilos generales (styles.css):

html,body {
  margin: 0;
  padding: 0;
  width: 100%;
  height 100%;
}

app.component.css
Puede usar el selector :host para hacer referencia al contenedor app-component y asi no es necesario hacer wrappers o div contenedores

:host {
  display: flex;
  width: 100%;
  height: 100%;
  background-image: url(......);
  background-size: cover;
  background-repeat: no-repeat;
 }
0

Complementando lo que @enxaneta, si sigue pasando después de revisar que no sea algún otro elemento que esté interfiriendo con el margen, usa margin: 0 0. En teoría solo un 0 debería hacer que le aplique a las 4 márgenes, pero me ha funcionado más especificarle que lo aplique así.

1

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.