CODEWITHSUNDEEP
htmlcss
user3541631
user3541631

Reputation: 4008

Scale an image only by width or height

I have an image:

<img src="#" width="42" >

If I set only the width, Firefox and IE will scale also the height, but Chrome doesn't it keep the initial image height. Can Chrome behavior be fixed ?

If I set just the height is not taken in consideration. Can an image be scaled by height ?

Upvotes: 2

Views: 1162

Answers (3)

Xantium
Xantium

Reputation: 11603

Setting height to auto should work. For example:

<img src="#" width="42" height="auto">

If height: auto; the element will automatically adjust its height to allow its content to be displayed correctly.

This will work for all modern browsers and works for both % and px, em sizes ect.

See W3schools

Or using inline styles:

<img src="#" style="width:42; height:auto;">

Edit: I'm not sure you did not mean give height a value and make width resize automatically. In which case width: auto should do fine.

Upvotes: 2

JamesBond
JamesBond

Reputation: 312

Instead of letting HTML do the work, let CSS do it.

Change :

<img src="#" width="42" >

To :

<img src="#" style="width: 42px; height: auto;">

That will allow CSS to resize the image.

Upvotes: 2

Mr.Engineer
Mr.Engineer

Reputation: 21

.img
{
   width:auto;

   height:auto;
}

You can define width and height in css

Upvotes: 0

Related Questions