border designs

[jl8789]

Anyone know of a place where I can find everything that I can do with borders?

I have a div that I want to look 3dimensionally sunk like a list box or something by changing the border styles. So far I have:
<div id='scroll_clipper' style='position:absolute; width:390px; height: 325px; overflow:auto; border-left:2px solid black; border-top:2px solid black; border-right:1px solid gray; border-bottom:1px solid gray; background-color:#a5c3fd'>
<div id='scroll_text' style='background-color:#a5c3fd'>
<p style="line-height: 14px">
<b>iHub</b><br>
<cfoutput query="getAllNewsQuery">
<li><cfif isDefined("updtDt") and updtDt neq "">#updtDt#<cfelse>#insDt#</cfif> - #TIN_USER_MESSAGE#</li>
</cfoutput>
</p>
</div>
</div>

 

[Chacalinc]

replace:

style='position:absolute; width:390px; height: 325px; overflow:auto; border-left:2px solid black; border-top:2px solid black; border-right:1px solid gray; border-bottom:1px solid gray; background-color:#a5c3fd'

with:

style='position:absolute; width:390px; height: 325px; overflow:auto; border: 2px outset black; background-color:#a5c3fd'

or

style='position:absolute; width:390px; height: 325px; overflow:auto; border: 2px inset black; background-color:#a5c3fd'

 

[jl8789]

Try it once. The borders just look they do when they are solid and not three dimensional.

 

[Chacalinc]

what's your browser? mozilla works good.

 

[jl8789]

Our standard where I'm at states that we HAVE to use Microsoft Internet Explorer Version 6+

 

[Chacalinc]

I tested pages using that "border: 2px outset #000" and works good...

anyway, this is a good site for CSS:

http://www.w3schools.com/

you can see:

http://www.w3schools.com/css/css_border.asp

hope this helps.

 

[jl8789]

Thanks for the help, I'll look into it.

 

[jl8789]

This gives the 3D effect perfectly.

border: 2px inset lightgray;

The 3D effects depend on the colors you choose.

 

[Chacalinc]

great! I will put that border in my documentation of "good desings for IE".. never tryed that color, actually I use colors hard coded (#000 or #023455, only example).

Cheers.