MyBB Community Forums

Go to:
Private Messaging Templates > private_pmspace

Replace the entire content with:

<span class="smalltext float_right">&nbsp;<strong>{$overhalf}{$belowhalf}</strong></span>
<div id="pm_usage" title="{$overhalf}{$belowhalf} {$lang->pmspaceused}">
<div id="pm_usage_bar" style="width: {$overhalf}{$belowhalf}"></div>
</div>

<style type="text/css">
#pm_usage {
	float: right;
	width: 150px;
	border: 1px solid #0F5C8E;
	padding: 1px;
	height: 12px;
}
#pm_usage_bar {
	background: red;
	padding: 6px 0;
}
</style>

Result:



Restyle it as you like changing the CSS properties ...

Happy coding