1 Replies - 451 Views - Last Post: 29 August 2012 - 11:31 PM

#1 clarissa_milner  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 22
  • Joined: 23-August 12

Banner Image

Posted 29 August 2012 - 10:26 PM

I have been trying to add a banner image, but I have not been able to make it fit the area, can anyone help?
Is This A Good Question/Topic? 0
  • +

Replies To: Banner Image

#2 StefanOnRails  Icon User is offline

  • D.I.C Head

Reputation: 35
  • View blog
  • Posts: 105
  • Joined: 31-July 12

Re: Banner Image

Posted 29 August 2012 - 11:31 PM

View Postclarissa_milner, on 30 August 2012 - 07:26 AM, said:

I have been trying to add a banner image, but I have not been able to make it fit the area, can anyone help ?

OK, first thing first, how do you add your banner? as an HTML element OR as a background for a div ?

HTML image
<div id="container"> <img src="banner.png" width="100%" height="100%" /> </div> 
CSS Background
#container{
...
background-image: url("banner.png");
background-size: 100% 100%; /* property supported in IE9+, Firefox 4+, Opera, Chrome, and Safari 5+. */
}

However, my advice is to not try to stretch your image and loose precious quality - unless, of course, you use an .SVG (Scalable Vector Graphics). Also when you customize the WIDTH & the HEIGHT for an image element you only change the way it's displayed on the page, the browser will still have to load the full-size image - that means you should always provide an image which has the exact desired dimensions.

Hope it helped you :)
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1