将图像与输入框和文本向左对齐

问题描述:

我已将图像与输入框左侧对齐,但书写与图像重叠。我如何解决这个问题?该图像已被左对齐就好了,我只需要输入文本进行重叠将图像与输入框和文本向左对齐

CSS 
input { 
background: url(../../core/images/search.png) no-repeat center left 5px #FFF; 
text-align: left; 
padding: 5px; 
font-family: 'Raleway', sans-serif; 
color: #444; 
border: 3px solid #FFF; 
outline: none; 
border-radius: 3px; 
margin: -4px 20px; 
position: absolute; 
width: 270px; 
} 

HTML 
<input type="text" autocomplete="off" name="name"> 

的现在,而不是对准图像右侧根据image

+0

谢谢,它工作! –

widthpadding-leftinput为什么不使用padding?看一看:

padding-left: 65px; 

的jsfiddle:​​

或者text-indent

text-indent: 65px; 

的jsfiddle:http://jsfiddle.net/8JLXj/10/

使用文本索引属性:

text-index:(pic\'s width+gap between pics and first letter)px; 

或者您也可以使用padding-left:10px;创建距离图片的距离。