The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS setting size of image

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #36272

    Hi there I am learning CSS
    Just learned that unordered list can be used to create very good navigation links. I wanted to add images to these links. So the CSS I got in one book is to add image as background to the li.

    However the image I have is very big. Can I set the size of the image in background:
    ul li#skype a
    background: #fff url(../Images/Skype.png) no-repeat top left;

    Above Skype.png is very big and is displayed in cuts:

    So is there any way to resize image in background of li (list item, not the webpage).


    Stevencrader is right. When possible edit your photo in an image processor, giving it the appropriate dimensions.

    For the sake of learning however, there is a CSS3 property which allows you to play with “background-size”, however most legacy browsers won’t support this (read IE) and it’s not optimal for page performance.


    @philip_mcl rather make use of verified documentation, such as Mozilla Developer Network.


    Thanks. Actually that CSS3 background-size property is pretty neat. And works great on Chrome 10, IE9 and Firefox 8. Though it is not full-proof on old browsers. Reducing the image size is fine, but is it good. Image may pixlate when zoomed?

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.