Image size 100 % - CSS HELP

[lionel.web]

Hi!

I try to do this:

I have an element, and i want the background image to be all over the background.

e.g.
<div id=""mydiv"">
</div>

#mydiv{width:100%; height:100%;background:url(images/image1.jpg) no-repeat; background-size:cover;}

If i want, to do this:

<div id=""mydiv"">
<img src=""images/image1.jpg"">
</div>

#mydiv{width:100%; height:100%;}
#mydiv img{}

How can i make the same effect, with the image, to be cover all over the div????
But, without background-size:cover. Is it possible???

 

[chrishirst]

How can i make the same effect,

Make the parent div have the same dimensions as the image.

 

[lionel.web]

Thanks for your answer, but that's not what i want.

I want the image to be fill in the parent div. Even if cropped.
Like background-size:cover;
The parent div, is 100% width, 100% height (fullscreen)

Can this be done with html/css/javascript ?

 

[chrishirst]

Try

img {
    max-width: 100%;
    max-height: 100%;
}

But expect the image to be distorted if the aspect ratio of the parent element does not match the image aspect ratio exactly.

Other than that, background-size: cover; IS the way to fill the parent without distorting the image.

 

[lionel.web]

Thanks chrishirst.
I'll try max-width, max-height 100%.

Do u know any javascript, that will make the trick correctly like background-size:cover ???

 

[chrishirst]

It's not something I've ever needed so have not investigated what is required to accomplish it.

 

[Brian Angel]

Because he is DA MAN....

http://css-tricks.com/perfect-full-page-background-image/

 

[lionel.web]

@Brian Angel
Thanks a lot!
That was, what i needed!!!!
Great article/link!

 

[chrishirst]

you can also resell reseller plan and the control panel is completely anonymous. You can also configure an addons and resell addons to your customer too.

And that is related to this question, ..... .... because??????