Liu Yongtai
Liu Yongtai

Reputation: 21

Setting image width according both container width and image's original width using CSS?

Is there any way to get the following effect using CSS?

Upvotes: 1

Views: 656

Answers (2)

Liu Yongtai
Liu Yongtai

Reputation: 21

I found that the following CSS code could achieve the goal. But according to CSS Standard, when the value of max-width is percentage, it is "calculated with respect to the width of the generated box's containing block". According to my understanding, set max-width to 100% should take no effect, but it seems wrong.

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

The code is tested in Firefox 12 and IE 9. See http://jsfiddle.net/EnZEP/

Upvotes: 1

sandeep
sandeep

Reputation: 92803

May be you can do like this:

for example:

img{
    width:100%;
    height:auto;
    max-width:400px;
}

check this http://jsfiddle.net/aqh2r/

Upvotes: 2

Related Questions