Forum Moderators: not2easy

Message Too Old, No Replies

Can you crop a background image while repeating?

         

grahama

8:41 pm on Nov 29, 2006 (gmt 0)

10+ Year Member



If you are going to repeat a background-image, is it possible to crop the portion of the image that repeats?

I am trying to use one image and background-positioning for the top bar, middle section, and bottom bar to expand/contract with text resizes.

something like:
/* top_bar shows top 15 pixels of image */
#top_bar{height: 15px; background: url('image')no-repeat 0 0;}

/*I would like to crop the top and bottom of 'image' by 15 pixels and repeat*/
#middle{background: url('image') repeat-y 0 0;}

/* btm_bar shows bottom 15 pixels of image */
#btm_bar{height: 15px; background: url('image')no-repeat 0 100%;}

is this possible, or do I need to use a separate image for the repeating middle section?

many thanks in advance

Fotiman

9:01 pm on Nov 29, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



It's not possible. You'd need to use a different image.

grahama

9:37 pm on Nov 29, 2006 (gmt 0)

10+ Year Member



many thanks for the heads up
g