CSS Border style colors

Reply Mon 22 Sep, 2008 12:23 pm
Is there a was with CSS to change the color of the border color for both colors when you have an inset or an outset? I don't want to just do border-right border-left thing because if I do that, I don't get the inset/outset 3D part.
Robert Gentel
Reply Mon 22 Sep, 2008 12:32 pm
It's not clear to me what you are trying to do. You can set the color of the border while using an inset or outset but the inset/outset just takes that color and uses a light version of it for some borders and a dark version of it for others to show an illusion of 3d depth to it.

Here is an example:
<style type="text/css">
border: medium inset red;
<div class="theBorder">An Example Border</div>
0 Replies
Nick Ashley
Reply Mon 22 Sep, 2008 03:03 pm
Robert is correct. If you want to be more specific with your colors, you can set each border's color individually, and create the inset/outset yourself.

For example, this:
border:1px outset red;

is the same as this:
border-top:1px solid #FFB2B2;
border-left:1px solid #FFB2B2;
border-right:1px solid #8D0000;
border-bottom:1px solid #8D0000;

So you are creating the same effect, but that way can control your colors specifically. This will also ensure the borders look the same in all browsers. I am not 100% sure that doing "1px outset red;" will render the same in all modern browsers or not. (I'd guess it will, but haven't tested it)
0 Replies
Reply Wed 17 Apr, 2019 04:57 am

color for the border:
div {border-color: coral;}

style for the border:
div {border-style: dotted;}
0 Replies

Related Topics

  1. Forums
  2. » CSS Border style colors
Copyright © 2019 MadLab, LLC :: Terms of Service :: Privacy Policy :: Page generated in 0.03 seconds on 04/18/2019 at 02:21:07