Как отобразить сообщение inline

Question

У меня есть изображение, которое показывает знак плюса, а рядом с изображением отображает небольшое сообщение. Код ниже:

<table id="plus" align="center"> 
<tr> 
<th> 
<input type="image" src="Images/plussign.jpg" name="plussign" width="30" height="30" id="plusimage"><span id="plussignmsg">(Click Plus Sign to look <br/> up Previous Questions)</span> 
</th> 
</tr> 
</table> 

Проблема заключается в том, что сообщение на самом деле не отображается рядом с изображением. Изображение имеет высоту 30 пикселей, но сообщение отображается приблизительно с высоты 10 пикселей. Как я могу получить сообщение рядом с изображением, чтобы правильно отображать встроенное изображение.

Ниже CSS:

#plusimage{ 
    clear:right;  
}   

#plussignmsg{ 
    font-size:10px; 
    display:inline; 
} 

Answer 1

Попробуйте это:

#plusimage{ 
    float:left; 
}   

#plussignmsg{ 
    font-size:10px; 
    display: block; float:left; 
} 

В последнее время я нашел отображение контейнера в виде таблицы, и содержимое в виде таблицы также работает.

Answer 2

Попробуйте float изображение

#plusimage{ 
    float: left; 
} 

Answer 3

попробовать

#plusimage{ 
    display:inline; 
} 

Answer 4

Use this. I have added css class for align image to vertical middle. 

<style type="text/css"> 
    #plusimage 
    { 
     vertical-align:middle; 
    } 
    </style> 
    <table id="plus" style="width:100%; text-align:center;"> 
     <tr> 
      <th> 
       <input type="image" src="Images/add_user.png" name="plussign" id="plusimage"><span id="plussignmsg">(Click Plus Sign to look up Previous Questions)</span> 
      </th> 
     </tr> 
    </table>