Stylesheets - Stretching a portion of an image

Author

Stretching a portion of an image

elephant

2007-03-21, 7:21 pm

I'm trying something in CSS, and I was wondering if anyone knows of a
way to do it.

The goal is to have one image with a width of 25px, and have the left
12 pixels be one side of an image of indeterminate width, the right 12
pixels be the right side of the image, and the center pixel to stretch
the entire distance in between. I know how to do this using three
separate images, but is it possible to do it by just somehow
stretching the 1 pixel in the center?

Thanks! =)

scripts.contact

2007-03-21, 7:21 pm

elephant wrote:
> The goal is to have one image with a width of 25px, and have the left
> 12 pixels be one side of an image of indeterminate width, the right 12
> pixels be the right side of the image, and the center pixel to stretch
> the entire distance in between.

something like this-
style-
img {position:absolute}
img.a {left:0;top:0;clip:rect(0 12px auto 0)}
img.b {left:12px;top:0;width:40%;height:26px}
img.c {right:12px;top:0;clip:rect(0 auto auto 13px)}

html-
<img src="xx" class=a>
<img src="xx" class=b>
<img src="xx" class=c>

elephant

2007-03-21, 7:21 pm

On Mar 21, 4:05 pm, "scripts.contact" <scripts.cont...@XXXXXXXXXX>
wrote:
> elephant wrote:
>
> something like this-
> style-
> img {position:absolute}
> img.a {left:0;top:0;clip:rect(0 12px auto 0)}
> img.b {left:12px;top:0;width:40%;height:26px}
> img.c {right:12px;top:0;clip:rect(0 auto auto 13px)}
>
> html-
> <img src="xx" class=a>
> <img src="xx" class=b>
> <img src="xx" class=c>

Awesome =) Thank you very much