Victor Subervi wrote:
> I have this that works well:
>
> img { border:10px solid #7B2E91 }
>
> I would like to do one on top of another, something like this:
>
> img { border:10px solid #7B2E91 }
> img { border:20px solid #000000 }
It won't work, since the latter rule just overrides the former.
You could use the outline property to create a simulation of a second
border, using
img { outline:20px solid #000000 }
as the second rule. Howover, outline has essentially more limited support
than border. Moreover, outline is rather special, as it appears around an
element's box and may thus cover other content - though you might use img
{ margin: 20px; } to create space for the outline.
Alternatively, you could wrap the img element inside another element and set
the other border on that element. This gets somewhat awkward, though, as you
would need to make the container dimensioned according to the img
dimensions.
The most reliable way is to not use CSS at all for the borders. Simply use
your favorite image processing software to add the desired borders into the
images themselves.
--
Yucca, http://www.cs.tut.fi/~jkorpela/
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
