Template talk:Event bar

Alternatively, we could use

<div style="position:relative; height:1.2em; bottom:3px;"><div style="position:absolute;">[[File:Event bar empty2.jpg|link=]]</div><div style="position:absolute; width:{{#expr: {{{1|100}}} / 100 * 202 }}px; overflow:hidden;">[[File:Event bar.jpg|link=]]</div></div>

Which produces this (where the width is dictated by the percentage input, but defaults to 100% (in this example I've set it to 60%):

It could be made inline at the beginning by the use of spans instead of divs, but I can't see a way of making any text not take a newline after it even with spans.

P.s. for anyone looking at the raw code, wondering why 3px from bottom of line, it centralises it top-bottom. Chieftain Alex 10:05, 26 October 2012 (PDT)

We could do that, but I don't see a use for it. All we need is to show a full bar or an empty bar to indicate whether a bar must be emptied or filled to complete an event. When would we ever need to show a bar at 60%? —Dr Ishmael 10:16, 26 October 2012 (PDT)

Dunno, I don't even play this game ^_ which reminds me I'll go off to do some work --Chieftain Alex 10:27, 26 October 2012 (PDT)