Reputation: 75

HTML DIV background

I have a <div> that includes a background image like this:

<div style="
  background: url('file://D:/DwyaneJohnsonBaller.jpg');
  width:100%; 
  height:1200px; 
  background-size: 100%;">
</div>

I've also tried to make the style of the <div/> in CSS format.

The problem I'm facing is that when I display the HTML file, I find some white spacing from top, right, left and bottom (i.e not fit with the whole web page).

Upvotes: 0

Answers (5)

Sebastian Witeczek

Reputation: 133

body{
 margin: 0;
 padding: 0;
}

Upvotes: 0

Ronald Mathews

Reputation: 2248

Use - margin: 0;

You can solve this by adding the following code to the head part of your html file:

<style>
  body{
  margin:0;
  }
</style>

Without this browser will display the content with blank spaces on all sides.

Upvotes: 2

Kebab Programmer

Reputation: 1219

in your CSS file, you can input the following lines of code to make sure you get the right image, and also you can modify the size of the image to remove the white lines you are experiencing

body 
{
  background-image:url("otherimages/background.jpg");
  background-size:105%;
}

Also, since "background-size" is there, you don't need to have "width and height" parameters. You can experiment with this, to make sure it works with your own project

Upvotes: 0