Center Font-Awesome buttons

by microbians

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css">
<div>
<span id="text">Hello world</span>
    <i id=ico class='icon icon-2x icon-camera'></i>
</div>

<div>
    <span id="text">Hello world</span>
</div>


<div>
    <i id=ico2 class='icon icon-2x icon-camera'></i>
    <span id="text">Hello world</span>
</div>

<div>
    <i id=ico3 class='icon icon-2x icon-camera'></i>
    <span id="text">Hello world</span>
</div>

<div>
    <i id=ico3 class='icon icon-2x icon-camera'></i>
    <span id="text2">Hello world</span>
</div>

CSS

body {
    padding:30px;
    font-family: helvetica;
}
div {
    border: 0;
    padding: 8px 50px;
    display: inline-block;
    color: #FFF;
    background: #f02d00;
}

#ico { 
    float:right;
    line-height:24px;
    padding-right:30px;
    font-size: 20px;
}

#ico3 { 
    float:left;
    line-height:24px;
    padding-right:10px;
    font-size: 10px;
}
#ico2 { 
    float:left;
    line-height:24px;
    padding-right:10px;
    font-size: 17px;
}
#text {
    float:left;
    line-height:24px;
    font-size: 20px;
}

#text2 {
    float:left;
    line-height:24px;
    font-size: 40px;
}