Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Dec 2005
    Location
    Ohio
    Posts
    286
    Thanks
    7
    Thanked 9 Times in 9 Posts

    Adjusting the size of a background image

    I doubt there is much hope for this, but here goes:

    I have a list where each part of the list holds a different background image. I am planning on "overlaying" a blank gif on each list item. So far, I have got the effect I want, however there is now an issue with the sizes of my background images in that they are all different sizes and far too big.

    I want to resize each background image so that each one will be 700x200 for example. From some searches I have been conducting, there appears to be a CSS property, background-size, that would work for me, however I think it is only CSS3 and would not work in many browsers. I suppose my other options are to resize all of my images, however there are hundreds and I would like to keep from doing that. If background-size is not only CSS3, what values would I use to on it to change the width and height, for example?

    This is the code I am using, if it could help:
    Code:
    CSS
    #two {
    	background: url('../toolarge2.jpg') center no-repeat fixed;
    	}
    #three {
    	background: url('../toolarge3.jpg') center no-repeat fixed;
    	}
    #four {
    	background: url('../toolarge4.jpg') center no-repeat fixed;
    	}
    
    HTML
    <ul>
    <li id="two"><img src="../overlay.gif" GALLERYIMG="no" alt="image" /></li>
    <li id="three"><img src="../overlay.gif" GALLERYIMG="no" alt="image" /></li>
    <li id="four"><img src="../overlay.gif" GALLERYIMG="no" alt="image" /></li>
    </ul>
    Last edited by kaitco; 07-04-2006 at 08:35 PM.

  • #2
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,387
    Thanks
    32
    Thanked 288 Times in 282 Posts
    Yeah, background-size is a CSS3-only property. Why don't you just resize the images in an image editor? I can't really tell what you're trying to do but it would seem like its being over-complicated.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #3
    Regular Coder
    Join Date
    Dec 2005
    Location
    Ohio
    Posts
    286
    Thanks
    7
    Thanked 9 Times in 9 Posts
    ::Sigh::

    I figured it would be, but it will be fantastic once all browsers support it....

    It does look like I will end up doing that, but I was trying to avoid it because I am using so many different images. I am trying to address an image theft issue, but I will not get into it because I know the flora of commentary about protecting content and such.

    Thanks, though!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •