0
   

CSS Border style colors

 
 
meesa
 
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
 
  3  
Reply Mon 22 Sep, 2008 12:32 pm
@meesa,
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:
Code:
<html>
<head>
<style type="text/css">
.theBorder
{
border: medium inset red;
}
</style>
</head>
<body>
<div class="theBorder">An Example Border</div>
</body>
</html>
0 Replies
 
Nick Ashley
 
  2  
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:
Code:.outsetBorder{
border:1px outset red;
}


is the same as this:
Code:.outsetBorder{
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
 
sumita12sofat
 
  0  
Reply Wed 17 Apr, 2019 04:57 am
@meesa,

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