Simple cell question

[bobnew32]

On all phpbb forums, they use css to control cell colors. Well, in their blue theme (default color scheme) they use a blue color that looks rather 3dish! I want to learn how to do this, can somebody please help? Thx

[Purple Martin]

You could play with the border colours. If you set the top and left borders to a lighter colour, and set the bottom and right borders to a darker colour, you'll get the "drop-shadow" 3D-effect similar to many "3D" buttons.

If you want to get really fancy, use JavaScript to change the border colours onMouseDown: set the top and left to darker, and set the bottom and right to lighter. It'll look like the button has been pressed "down" (into the screen) when the user clicks the button.

Have fun!

[bobnew32]

Can you give me some example code to achieve this? Thx in advance, i am very new to css (very new).

Plus it doesnt seem like whole colors like one color on top and one on bottom. It actually fades into the new color is what im looking for.

[John_Caius]

They're using a background image to achieve the fade and using the css to call the background image using

background-image: whateverfilename.jpg

It's a vertical image, probably one pixel wide, fading from top to bottom, that tiles horizontally across the background of the cell to produce the effect.

Commenting on the previous reply, note that divs can have border styles:

border-width: 2px;
border-style: inset/outset/groove/ridge;
border-color: red;

Try it and see - it's simpler than giving each border a different shade. :)