alignment problem in 3 col layout

[nch]

The page http://wsdev.colostate.edu/cwis116/admmock/dsp_fr.cfm
looks aligned in IE 6.0 and the page border looks shifted in Mozilla 1.7.5.
There is a gap (white line) between the border and the right column.
How can I fix this in Mozilla. If I shift the right col to close the gap still the banner does not look ok.


Thanks.

CSS :-

body {
background-color :#003300;
margin : 0px;
outline : 0px;
padding: 0px;
color: #000000;
font-family : Verdana, Arial, sans-serif;
text-align: center; /*for IE */
font-size: xx-small;
}
.pageBorder{
border : medium ridge #DDC642 ;
color : #000000;
padding : 0px 0px 0px 0px;
width : 760px;
margin: 0 auto; /* align for good browsers */
text-align: left;/* counter the body center good browsers*/
background-color : #ffffff;
}
/* Fix IE. Hide from IE Mac \*/
* html #leftnav ul li { float: left; }
* html #leftnav ul li a { height: 1%; }
/* End */
#leftcol {
width : 175px;
float : left;
position : relative;
margin-left : -175px;
margin-right : 1px;
}
#rightcol {
width : 175px;
float : right;
position : relative;
margin-right : -175px;
margin-left : 1px;
}
#maincol {
float: left;
width : 100%;
position : relative;
margin : 0 -8px 0 -2px;
}
.content {
padding-left : 8px;
padding-right : 8px;
}
#outer {
border: solid white 0px;
border-left-width : 175px;
border-left-color : #003300;
border-left-style : solid;
border-right-color : #dddddd;
border-right-style : solid;
border-right-width : 175px;
background-color : #FFFFFF;
width : auto;
border-bottom : 1px solid #DDC642;
}
#inner {margin:0; width:100%;}
#outer>#inner{}
#footer { text-align:center; margin:0 auto; width:100%;}

[toicontien]

That "white" line is actually colored #F4EDC6 and is how Firefox renders ridge style borders. IE6 is either not supporting the ridge style or it's just a difference in how browser developers interpreted the standard.

So the answer is either live with it or use graphics for the borders.