2 replies [Last post]
bike5
Offline
newbie
Last seen: 16 years 34 weeks ago
Joined: 2004-04-01
Posts: 3
Points: 0

I know you can't use the bordercolorlight/dark in CSS but I can't find fine an equiv solution in css for ->
<table border="1" width="80%" cellspacing="0" cellpadding="2" bgcolor="#282828" bordercolordark="#000000" bordercolorlight="#333333">
I have tried a million combinations using:
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #333333;
border-right-color: #000000;
border-bottom-color: #333333;
border-left-color: #000000;
background-color: #282828;

all diffrent line styles, widths, colors, and I have yet to find anything that looks like the bordercolordark/light combo I have. Is there any way to convert that to css exactly or is that not possible (at least to make it exact as how it was)? Thanks.

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 3 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Cannot find equiv in css bordercolordark/light

Hi

I know what you want, and the effect you want.

If you have a div with the one set of colors and borders, and another div inside that with the others, that is the only way I can think of achieving it. You can use the border style outset and inset, but moz only uses one light and one dark color, IE uses two.

Have a look at this code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>New document</title>
<link rel="Stylesheet" href="" type="text/css" media="All" />
<style type="text/css">
#outerdiv{
width:80%;
border-left:1px solid #00FF00;
border-top:1px solid #00FF00;
border-right:1px solid #FF0000;
border-bottom:1px solid #FF0000;
}
#innerdiv{
width:auto;
border-left:1px solid #FF0000;
border-top:1px solid #FF0000;
border-right:1px solid #00FF00;
border-bottom:1px solid #00FF00;
}
p {
margin:2px;
}
</style>
</head>
<body>
<table border="1" width="80%" cellspacing="0" cellpadding="2" bgcolor="#ffffff" bordercolordark="#FF0000" bordercolorlight="#00FF00"> 
<tr><td>hello</td></tr></table>
<div id="outerdiv"><div id="innerdiv"><p>hello</p></div>
</div>
</body>
</html>

Is that what you wanted?

Trevor

DCElliott
DCElliott's picture
Offline
Leader
Halifax, Canada
Last seen: 3 years 29 weeks ago
Halifax, Canada
Timezone: GMT-3
Joined: 2004-03-22
Posts: 828
Points: 0

Cannot find equiv in css bordercolordark/light

If you set a border color to be the same as your background and then use the border-style:inset|outset property, it will choose a highlighted color to the top and right and a shadowed color to the bottom and left for "outset" and vice versa for inset. You might do this as styles with: background-color:#282828; border:2px outset #282828; Be aware that different browsers chose different degrees of lightness/darkness from the central color.

DE

David Elliott

Before you ask
LearnXHTML|CSS
ValidateHTML|CSS