Without spending too much time testing...
You might be able to do something like this:
<div style="width: 180px; height:135px;
background-image:url('./transborder.png')">
<img src="transparent-border.png" style="width:100%, height:100%;" />
</div>
All the styles would go in the stylesheet except for possibly the thumbnail
image so it could be populated dynamically.
Interesting question for sure.
Jamie
On Wed, Jun 17, 2009 at 11:53 AM, Amanda Obringer
<[email protected]>wrote:
> might be kinda complicated, but what i you have divs surrounding the image
> that created little css boxes with transparency? like:
>
> <div id="topBorder"></div>
> <div id="leftBorder"></div>
> <div id="image"></div>
> <div id="rightBorder"></div>
> <div id="bottomBorder"></div>
>
>
>
> On Sat, Jun 13, 2009 at 5:51 PM, [email protected] <
> [email protected]> wrote:
>
>>
>> Looking at the "latest product" images on this.
>>
>> http://magento-themes.joomlart.com/jm_sulfur/
>>
>> I see they have a nice darkened transparrent border. In the case of
>> this example, they are done by overlaying an image. The problem with
>> this method is that if you change the size of the image in html, you
>> also then have to spend time adjusting the overlay.
>>
>> Is there a batter way of creating this effect? One that would scale
>> better so could be used with different size images?
>>
>>
>>
>
> >
>
--~--~---------~--~----~------------~-------~--~----~
--
You received this because you are subscribed to the "Design the Web with CSS"
at Google groups.
To post: [email protected]
To unsubscribe: [email protected]
-~----------~----~----~----~------~----~------~--~---
