Div with background-image (100% width 100% height)

Question

what I want to achieve is a div with a background-image that reflects the size of the div, I do not care who maintain the aspect ratio

Some test

<div style='position:absolute;width:"+obj.width+"px;height:"+obj.height+"px;margin-left:"+obj.left+"px;margin-top:"+obj.top+"px;background-image:url(img.png);background-size: 100%;background-repeat: no-repeat;border:1px solid red;'>;

enter image description here

<div style='position:absolute;width:"+obj.width+"px;height:"+obj.height+"px;margin-left:"+obj.left+"px;margin-top:"+obj.top+"px;background-image:url(img.png);background-size: cover;background-repeat: no-repeat;border:1px solid red;'>;

enter image description here

<div style='position:absolute;width:"+obj.width+"px;height:"+obj.height+"px;margin-left:"+obj.left+"px;margin-top:"+obj.top+"px;background-image:url(img.png);background-repeat: no-repeat;border:1px solid red;'>;

enter image description here

This is a bad question, you could have just used Google. This is basic stuff here. — Ruddy, Sep 04 '14 at 07:09
Duplicate of [Stretch and scale CSS background](http://stackoverflow.com/questions/376253/stretch-and-scale-css-background) — Charles J. Daniels, Sep 04 '14 at 08:41

score 2 · Accepted Answer · answered Sep 04 '14 at 07:06

2

Try this:

background-size: 100% 100%;

OR

background-size:auto 100%;

answered Sep 04 '14 at 07:06

Abdulla khan

758
5
11

Div with background-image (100% width 100% height)

Some test

1 Answers1