Cheezy barcharts? How to make coloured inline blocks?

[Howie]

Hi,

I've just been playing this afternoon with adding a cheezy barchart to
an existing database report. The report shows weekly movement in orders
- losses vs new orders. The chart would look like

----|++++++
------|+++
---|++++
|
in line with the existing table rows, each showing one week's data.

Mainly for my own amusement, I decided to try this with no graphical
elements at all - only HTML. So I my original plan was to have 5 spans
and change their background colours and widths to produce the 5 colour
segments per line:
[background][negative bar][black origin line][positive bar][background]

That doesn't work. You can't set the width of inline spans. What does
work in Firefox though is changing the border width instead:
<span style="border-left: solid 63px #fff;"></span>
<span style="border-left: solid 9px #f00;"></span>
<span style="border-left: dotted 1px black"></span>
<span style="border-left: solid 42px #0f0;"></span>
<span style="border-left: solid 93px #fff;"></span>

But that then doesn't work in IE/Win.

Is there a correct way to produce inline blocks of arbitrary colour and
width? I'm assuming at this stage that it's me that's wrong and not IE.

Best Regards,

Howard

[Nick Theodorakis]

Howie wrote:

Hi,

I've just been playing this afternoon with adding a cheezy barchart to
an existing database report. The report shows weekly movement in orders
- losses vs new orders. The chart would look like

----|++++++
------|+++
---|++++
|
in line with the existing table rows, each showing one week's data.
[...]
Is there a correct way to produce inline blocks of arbitrary colour and
width? I'm assuming at this stage that it's me that's wrong and not IE.

I have a couple of examples of what I think you are trying to do:

<http://theodorakis.net/cssart.html>

Nick

--
Nick Theodorakis
ni**************@hotmail.com
contact form:
http://theodorakis.net/contact.html