Выравнивание двух трех элементов на одной линии

Question

Как я могу сделать три элемента на одной строке с css? Я хочу сделать их на одной линии один за другим? Это то, что я для HTML

<div class="btn-votes"> 
     <input type="button" title="Up" class="up"/> 
      <div class="label-votes">2</div> 
     <input type="button" title="Down" class="down" /> 
</div> 

И это CSS

.btn-votes input[type="button"]{ 
    width:32px; 
    height:32px; 
    border:0; 
    cursor:pointer; 
    margin-bottom: -20px; 
    display:inline-block; 
} 
.up {background-image:url("")} 
.up:disabled {background-image:url('')} 
.down {background-image:url("")} 
.down:disabled {background-image:url('')} 
.label-votes {font-size:1.0em;color:#40CD22;text-align:center;font-weight:bold;} 

А вот JsFiddle .. Примечание: Изображения не показываются там, потому что у меня своя .. просто пытался для предоставления некоторого изображения для демонстрации.

Answer 1

Добавить display:inline-block в свой .label-votes класс

.label-votes { 
    font-size:1.0em;color:#40CD22;text-align:center;font-weight:bold;display:inline-block; 
} 

http://jsfiddle.net/hzqqcv4g/3/

Answer 2

Добавить дисплей: встроенный для всех из них.

.up{ 

    width:32px; 
     height:32px; 
    display:inline !important; 
} 

.down{ 
     width:32px; 
     height:32px; 
    display:inline !important; 
} 

.label-votes{ 
    display:inline !important; 
} 

http://jsfiddle.net/hzqqcv4g/1/