html - 如何在输入字段旁边插入图像 - HTML？

Question

我想在输入框旁边插入一张图片。这是我正在做的:

http://jsfiddle.net/a4aME/2307/

基本上，

.iconCamera {
  background: url('https://www.tutorialspoint.com/videotutorials/images/coding_ground_home.jpg') no-repeat;
  width: 50px;
  height: 50px;
}

<div class="A" style="display:inline-block">
  <div>
    <input type="text" placeholder="Product Key">
    <div class="iconCamera"></div>
  </div>
</div>

因为我已经给出了 inline-block，所以这两个组件应该并排显示在一行中，对吗？

但目前有堆叠一个在另一个下面。关于在这种情况下需要做什么的任何指示？

Answer 1

在 css 规范中使用 display: inline-block。

http://jsfiddle.net/a4aME/2310/

.iconCamera {
    background: url('https://www.tutorialspoint.com/videotutorials/images/coding_ground_home.jpg') no-repeat;
    width:50px;
    height:50px;
    display: inline-block;
}