Image is not stretched on another monitor

I have this part of HTML file

<div id="header">
...
</div>

and this part of CSS file

#header {
  background: url("img.png");
  background-repeat: no-repeat;
  background-position: left top;
  height: 140px;
  margin: 0px auto;
}

开发者_开发问答

The size of img.png is 1290 x 150 pixels. Everything was OK, but after I opened the web in sister's laptop the image is not stretched over all monitor (horizontally). There is about 50 pixels gap from the right.

Is there some general solution, so that the web will display same on all monitors?

thank you

---

It all depends on different screen resolutions useed by different monitors/devices.

You could let the image stretch to the size of the monitor if you use an image tag to display the image, and specify its width and height properties to be 100%, but that will result in a stretched image depending of the device used...

I suggest you to look for some tutorials about centering images while occupying all the avaiable space without blank space, and retaining image proportions at the same time.

---

your css code will not strech your background immage, it will only not repeat. as far as I know CSS wont even do that (streching an is possibe )