MyBB Community Forums

I am trying to line up some text and then the output.

I have forms that you input information into for the names:
Coins, Weapons, Seeds, Charms

So it will look like this when output

Coins: start the line here
Weapons: start the line here
Seeds: start the line here
Charms: start the line here

I want it to all start at the same area such as..

Coins:............start the line here
Weapons:.......start the line here
Seeds:...........start the line here
Charms:..........start the line here


Not sure how to do this.

<div class="output">
<div class="coins"><div class="label">Coins:</div><div class="count">start the line here</div></div>
<div class="coins"><div class="label">Weapons:</div><div class="count">start the line here</div></div>
<div class="coins"><div class="label">Seeds:</div><div class="count">start the line here</div></div>
<div class="coins"><div class="label">Charms:</div><div class="count">start the line here</div>
</div></div>

.output {
display: table;
}
.output > div {
display: table-row;
}

.output > div > div {
display: table-cell;
}

Easier ways to do it probably but eh. xD

I tried this but it keeps the text right up against the first part of text

Like...

Weapons:start the line here

Errr:

.output {
display: table;
width: 100%;
}
.output > div {
display: table-row;
width: 50%;
}

.output > div > div {
display: table-cell;
}

Actually I tried doing that and it messed all my stuff up. Anyway you can make it work with this?

<table cellpadding="4" cellspacing="1" border="0"  width="100%"  class="tborder">
	<tr>
		<td class="thead" colspan="4">More Details</td>
	</tr>
	<tr>
		<td class="trow5">
		Coins: <b>{$monster[\'coins\']}</b><br />
		Weapons: <b>{$monster[\'weapons\']}</b><br />
		Armour: <b>{$monster[\'armour\']}</b><br />
		Seeds: <b>{$monster[\'seeds\']}</b><br />
		Charms: <b>{$monster[\'charms\']}</b><br />
		Misc.: <b>{$monster[\'misc\']}</b><br />
		</td>
	</tr>
</table>

This is working perfectly for me except the issue I am having.

Each label "Coins:" etc needs to be in it's own td, as well as the text after it.

Basically, this.

<table cellpadding="4" cellspacing="1" border="0"  width="100%"  class="tborder">
    <tr>
        <td class="thead" colspan="4">More Details</td>
    </tr>
    <tr>
        <td class="trow5">
            Coins: <b>{$monster[\'coins\']}</b><br />
        </td>
    </tr>
    <tr>
        <td class="trow5">
            Weapons: <b>{$monster[\'weapons\']}</b><br />
        </td>
    </tr>
    <tr>
        <td class="trow5">
            Armour: <b>{$monster[\'armour\']}</b><br />
        </td>
    </tr>
    <tr>
        <td class="trow5">
            Seeds: <b>{$monster[\'seeds\']}</b><br />
        </td>
    </tr>
    <tr>
        <td class="trow5">
            Charms: <b>{$monster[\'charms\']}</b><br />
        </td>
    </tr>
    <tr>
        <td class="trow5">
            Misc.: <b>{$monster[\'misc\']}</b><br />
        </td>
    </tr>
</table>