我试图让带有图像背景的 div 显示在文本框的右侧。我试过 Float = none, left, right,我试过位置,甚至玩过边距,但似乎没有什么能让它留下来。
<div id="status" style="background-image:url(menubar/ajax-loader.gif); width:16px; height:16px; background-repeat:no-repeat; margin-left: 245px; margin-top: 2px;"></div>
<input name="strsearch" style="color:#333" type="text" id="strsearch" onKeyUp="Search(this.form)" value="Please enter your search criteria..." size="35" maxlength="75" onFocus="clearfield();" />
最佳答案
你觉得怎么样?
<input name="strsearch" style="color:#333" type="text" id="strsearch" onKeyUp="Search(this.form)" value="Please enter your search criteria..." size="35" maxlength="75" onFocus="clearfield();" />
<div id="status" style="display:inline;background-image:url(menubar/ajax-loader.gif); width:16px; height:16px; background-repeat:no-repeat;padding-right:16px;"></div>
向左和向右浮动尝试将您的元素尽可能远地扔到容器的一侧。如果您希望该元素位于第二个元素的右侧,请将其放在 HTML 中的第二个元素之后。此外,div
是 block 元素。 block 元素想要在他们自己的行上。使用内联元素(如 span
),或在您不想要的 block 元素上将 display
css 属性设置为 inline
新行。
编辑:这是给你的跨度
<input name="strsearch" style="color:#333" type="text" id="strsearch" onKeyUp="Search(this.form)" value="Please enter your search criteria..." size="35" maxlength="75" onFocus="clearfield();" />
<span id="status" style="background-image:url(menubar/ajax-loader.gif); width:16px; height:16px; background-repeat:no-repeat;padding-right:16px;"></span>
关于CSS 图像位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11999226/