El Retardo
El Retardo

Reputation: 21

Dynamic Logo Re-sizing using HTML or CSS

Hi trying to figure out how to dynamically resize a logo, when i use percentages it uses a percentage of the whole page not the div that contains it.

<img src="Images/logo.png" name="logo" id="logo">
<div id="top_border"></div>
<img id="background" src="Images/BG_1.jpg">

Any help will be greatly appreciated. thank you.

Upvotes: 1

Views: 1989

Answers (1)

Trifactor
Trifactor

Reputation: 63

In your CSS File add :

img {
width: 20%;
max-width: 300px;
height: auto;
}

And if you want to enforce a fixed max width of the image, just place it inside a container, for example:

<div style="max-width:300px;">
    <img src="image/example.jpg" />
</div>

Upvotes: 1

Related Questions