Centering a glyphicon inside a div

Centering a glyphicon inside a div

Here’s the fiddle: http://jsfiddle.net/sarvagnya1/BLAXF/
I need to center a glyphicon inside a div both vertically and horizontally.
Here’s the code:
HTML:

CSS:
.container{
width: 600px;
margin: 0 auto;
border: 1px solid #000;

}
.item{
width: 150px;
height: 150px;
border: 1px solid #ddd;

}
.item span{
font-size: large;

}

Solutions/Answers:

Solution 1:

You need the add this:

.item{
    ...
    text-align: center;
}
.item span{
    ...
    line-height: 150px;
}

http://jsfiddle.net/BLAXF/1/

References

Related:  Using bootstrap collapse with angularjs