我已在网络应用程序中为文本框实现了自动完成功能。 这里的问题是我的文本框宽度为100px。当用户开始输入时,加载指示符是添加到文本框的后台css。
我希望加载指示器位于页面的最右侧。
但由于指示符会附加到文本框(width = 100px),因此加载指示符会保留在其中。
请告诉我如何将装载指示器放在最右边。
答案 0 :(得分:0)
一个选项是将元素包装在包装器div
中,然后使用:after
伪选择器添加到您的加载指示符(只是演示文稿中的文本image
,将其替换为''
并使用background-image
以及height
和width
)。这两个示例显示了在右侧输入中的合理性,或者在页面右侧的所有方式。
HTML
<div class='wrapper'><input type='text' /></div>
<br>
<div class='wrapper'><input type='text' /></div>
CSS
html, body{
position:relative;
width:100%;
padding:0;
margin:0;
}
input{
width:100px;
}
.wrapper{
display:inline-block;
}
.wrapper:first-child{
position:relative;
}
.wrapper:after{
position:absolute;
content:'Image';
right:0;
}