Tabelle mit 2 divs?

[abwesend]

Hallo ich mach es kurz:

Habe 2 Bilddateien:

Das ist der Hintergund (1px breit in grau):

Das ist eine 1px breite Bilddatei in Blau:

Die graue ist der Hintergrund, die BLaue soll drübergelegt werden. Hier mal der Code:

<table width="152" height="18" border="0" cellpadding="0" cellspacing="0" background="images/berufgrau.gif" class="berufe">
                      <tr>
                        <td ><div style="background-image:url(images/berufblau.gif); width:$balkenberufone;" align="center"><span align="center" class="inde">$profone</span></div></td>
                      </tr>
                  </table>

Die Klassen:

.berufe {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color:#FFFFFF;
    border:#000000 solid 1px;
    z-index:2;
}
.inde{
    z-index:100;
    }

Also die breite vom Blauen blaken bekommt ich per php script (width:$balkenberufone;) und $profone ist ein Text und genau der Wurmt mich.

Der Text soll immer center sein und nicht abhängig von der Breite des Blauen balkens ich zeig euch das mal was ich meine:

So ist es:

So sollte es sein (oder so möchte ich es):

Aber ich hab keine Ahnung wie ich die Schrift unabhängig von dem Blauen Balken einfügen soll?!?! Kann mir einer Helfen mir fällt nix mehr ein. Hoffe ich habe es gut erklärt :) Wie ihr seht habe ich es schon mit z-index versucht

 

[sabf]

Hi,

also wenn das hier der Text ist
<span align="center" class="inde">$profone</span>

dann musst du in der css bei der klasse "inde" auch die Texteigenschaften eingeben "text-align:center;" wäre mein Vorschlag.

 

[threadi]

Die Frage ist eher was genau in $profone steht. Vermutlich ist dort ein Zeilenumbruch enthalten. Interessant wäre in dem Fall auch der erzeugte HTML-Code.

Falls kein HTML-Zeilenumbruch an der Stelle steht würde ich es mit

white-space: nowrap;

versuchen.