css - Align number beside glyphicon -


i cannot seem number align inline glyphicon. want number 3 pushed more lines up.

css

body {         background-image: url("bg1.png"); } .icons {         margin: 0px 0px 0px 10px; } .well {   min-height: 20px;   padding: 20px;   margin-bottom: 20px;   background-color: #ecf0f1;   border: 1px solid transparent;   border-radius: 4px;   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); } .well blockquote {   border-color: #ddd;   border-color: rgba(0, 0, 0, 0.15); } .well-lg {   padding: 10px;   border-radius: 6px; } .well-sm {   padding: 9px;   border-radius: 3px; } #alertbox {         padding: 2px 2px 2px 2px;         text-align: center; } #topicon {         font-size: 50px; } #stats {         font-size: 50px;         display: inline-block;         float: right; } 

html

 <div class="col-md-3">       <div class="well well-lg">            <div id="alertbox" class="alert alert-info">total apis</div>            <span id="topicon" class="glyphicon glyphicon-tasks"></span>            <span id="stats">3</span>       </div>  </div> 

screenshot

enter image description here

using positioning doesnt work when scaling since number 3 go center when on mobile phone. need auto-scale guess smaller browsers.

if remove float #stats, this:

.well {text-align: justify;} .well:after{content:""; width: 100%; display: inline-block; height: 0;} span {display: inline-block; vertical-align: middle;} 

Comments

Popular posts from this blog

how to proxy from https to http with lighttpd -

android - Automated my builds -

python - Flask migration error -