Getting annoyed!!

How do I get the text on the right to come out further without using &nbsp lol.



Here's the coding if you need it to fix it.

[code]

<style>
.topbar_swag {
background: #1A1A1A;
padding: 7px;
}

.topbar_swag:hover {
background: #025B72;
}

.topbar_swag:active {
background: #025B72;
}

.topbar_swagPM {
background: #1A1A1A;
padding: 7px;
}

.topbar_swagPM:hover {
background: #025B72;
}

.topbar_swagPM:active {
background: #025B72;
}

.topbar_swag:a {
color: #fff;
}

.pm_unread {
width: 100px;
color: #fff;
background: #252525;
padding: 7px;
-moz-border-radius-topleft: 4px;
-moz-border-radius-bottomleft: 4px;
-webkit-border-top-left-radius: 4px;
-webkit-border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
-webkit-border-top-right-radius: 4px;
-webkit-border-bottom-right-radius: 4px;
}
</style>

<a name="top" id="top"></a>

<div id="top-bar">
<div class="barz" style="padding: 6px;text-align: left;box-shadow: 0 0 5px #000;border-top: 3px solid #308198;background: #1a1a1a;position:fixed;z-index: 100;width:100%; padding-left: 90px;">
<a style="color: #fff;"class="topbar_swag" href="{$mybb->settings['bburl']}/index.php" title="Visit Home"><i class="fa fa-home"></i> Home</a>
&nbsp;&nbsp;
<a style="color: #fff;"class="topbar_swag" href="#"><i class="fa fa-diamond"></i> Upgrade</a>
<div style="float:right;";>
<a class="topbar_swagPM" href="{$mybb->settings['bburl']}/private.php">Private Messages: <b class="pm_unread">{$mybb->user['unreadpms']}</b></a>
</