Steve 25

When using moz-border-radius, you're limited to web only colors. Is there a way to use a custom color that you provide in a image file?

2 answers

0
points
This was chosen as the best answer

You might be looking for something like this

border-image: url(border.png) 27 27 27 27 round round;
Answered over 6 years ago by Craig Ward
Mottie 1134
2
points

You can set the border color using the same old border definition. The border radius only takes a number to indicate the radius of the border. For example:

.someElement {
  border: #0080ff 1px solid; 
  border-radius: 1em;         /* CSS3 standard */
  -moz-border-radius: 1em;    /* Firefox */
  -webkit-border-radius: 1em; /* Web kit */
}

I'm not sure where you found the information that says that using a border radius limits the colors available.

And, in case you don't know what Craig is talking about, check out this post.

Answered over 6 years ago by Mottie
  • My mistake - I was referring to web safe colors. Steve over 6 years ago
  • You are still using web safe colors? (http://www.lynda.com/resources/webpalette.aspx) Mottie over 6 years ago
  • No, there is no limitation to "web-safe" colours. Nothing in any W3C spec refers to "web safe" colours. In fact there was even some disagreement as to which colours are web-safe, but since the last 8-bit monitors probably died years ago, no one cares any more. Richard Grevers over 6 years ago
  • That should be `border: 1px solid #0080ff;` though, and `border-radius` should be put below the prefixed versions to override when they make a standard implementation, which might be improved from what they have now. Otherwise great. Jacob R over 6 years ago