How to make the bg image that will repeat reversely in the css?

Discussion in 'HTML & Website Design' started by StarBlossom, Oct 9, 2009.

0
  1. #1
    I am using an image for my site's background. It is a full width, big image. I want to make the image be reversely when it is repeated. Is there a way? I am using external .css.

    Thank you for your help.
     
    StarBlossom, Oct 9, 2009 IP
  2. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    437
    Best Answers:
    0
    Trophy Points:
    0
    #2
    You can't do that with CSS. The only thing you can do is double the size of the image canvas in a graphics program, copy the image and reverse it within the program, then add the reversed image to the canvas and save.

    Of course there's no reason to do this as with a bit of work you CAN make a full width background image that scales with the browser viewport.
     
    Dan Schulz, Oct 9, 2009 IP
  3. StarBlossom

    StarBlossom Peon

    Messages:
    27
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    The size was double on my site but since it is a huge image, the file size was 1,800,000. I cut it in half and it seems my site load fastest.


    I just google this issue. It said that there are few disadvantages.....
     
    Last edited: Oct 9, 2009
    StarBlossom, Oct 9, 2009 IP
  4. Martin K

    Martin K Active Member

    Messages:
    262
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    53
    #4
    If you want a picture for background make it smaller for example 200 x 200 pixels with one-color background and repeat it. Other way you can make your image to look good for 1024x768 resolution but it will not look good for 1800x600 for example. If your website doesn't load in 10 sec. 90% of users will just close your page. 1,800,000 B image on Internet with speed 100k/sec will load for 18 sec.
     
    Martin K, Oct 11, 2009 IP