tables HTML vs CSS

[Roedy Green]

I have flipped over nearly all the table logic on my website from HTML
to CSS.

I am using Opera 7.5

I could not get quite the same inset effects with CSS I could with
plain HTML. Plain HTML gives a sort of 3D effect of bars between the
cells. CSS is much more primitive looking, with overly dark bars, no
matter what I set the border-color.

Is there some attribute I am overlooking, or is that just the way it
is?

My style sheet is at http://mindprod.com/mindprod.css

--
Canadian Mind Products, Roedy Green.
Coaching, problem solving, economical contract programming.
See http://mindprod.com/jgloss/jgloss.html for The Java Glossary.

[Spartanicus]

Roedy Green <lo*****@mindprod.com.invalid> wrote:

I have flipped over nearly all the table logic on my website from HTML
to CSS.
I hope you only replaced tables used for layout?
I am using Opera 7.5

I could not get quite the same inset effects with CSS I could with
plain HTML. Plain HTML gives a sort of 3D effect of bars between the
cells. CSS is much more primitive looking, with overly dark bars, no
matter what I set the border-color.
You have borders showing on layout containers? If as I suspect you
replaced tables used to hold tabular data you should put the tables
back.
Is there some attribute I am overlooking, or is that just the way it
is?

CSS generated borders are rendered different from table borders in both
Opera and Mozilla (I forgot how IE behaves), there's no way to get them
to look the same.

--
Spartanicus

[Andrew Thompson]

On Tue, 29 Jun 2004 19:02:13 GMT, Roedy Green wrote:

I could not get quite the same inset effects with CSS I could with
plain HTML. Plain HTML gives a sort of 3D effect of bars between the
cells. CSS is much more primitive looking, with overly dark bars, no
matter what I set the border-color.

'border-style' is the property you seek.
It can be dotted, dashed, solid, double,
groove (whataboutfunk?), ridge, inset and outset..

I think the ones you are after are inset and outset,
but I usually use it in the shorthand way..

h1 { border: inset 2px #bfb; }

HTH

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology

[Andrew Thompson]

On Tue, 29 Jun 2004 19:20:23 GMT, Andrew Thompson wrote:

On Tue, 29 Jun 2004 19:02:13 GMT, Roedy Green wrote:

I could not get quite the same inset effects with CSS I could with
plain HTML.

.... h1 { border: inset 2px #bfb; }

It occured to me you might *also* play
with colors of individual borders, putting
border-left(?) and border-top lighter than
border-right / border-bottom..

...I use the other way, it is simpler.

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology

[Roedy Green]

On Tue, 29 Jun 2004 19:20:23 GMT, Andrew Thompson
<Se********@www.invalid> wrote or quoted :

'border-style' is the property you seek.
It can be dotted, dashed, solid, double,
groove (whataboutfunk?), ridge, inset and outset..

I think the ones you are after are inset and outset,
but I usually use it in the shorthand way..

inset and ridge get close to the default HTML behaviour, but don't
reproduce it. I am tempted to solve the problem by convincing myself
the CSS versions looks more BauHaus.

--
Canadian Mind Products, Roedy Green.
Coaching, problem solving, economical contract programming.
See http://mindprod.com/jgloss/jgloss.html for The Java Glossary.

[Roedy Green]

On Tue, 29 Jun 2004 20:23:13 +0100, Spartanicus <[e-mail]> wrote
or quoted :

You have borders showing on layout containers? If as I suspect you
replaced tables used to hold tabular data you should put the tables
back.

by layout containers you mean tables without borders just used to make
things line up? They seem to be rendering fine. Perhaps it is just
because most of them are tagged class="borderless".

--
Canadian Mind Products, Roedy Green.
Coaching, problem solving, economical contract programming.
See http://mindprod.com/jgloss/jgloss.html for The Java Glossary.