2012-02-22 56 views
2

我想要一个可调整大小的搜索框,就像你们都知道它来自例如。 FireFox 所以我需要一个输入框和一个放大镜作为右侧的按钮。可调整大小的搜索框,右边有图像

我已经做了一个试验案例吧:

http://jsfiddle.net/L8Wp3/61/

的事情是,调整大小不起作用。 当我调整整个页面的大小时,输入表单应该调整大小,并且图像应该随它一起流动。但我已经尝试了很多东西,图像有时只是打破了一条线....

我想要实现的是:我有两个输入标签(A & B)在div容器内,现在B应该流向权利和A应该采取所有可用的重命名空间。

我怎样才能在CSS实现这一点?

+0

我不明白,你想是这样的http://jsfiddle.net/L8Wp3/65/? – jacktheripper 2012-02-22 07:28:45

+0

绝对不是,你知道FireFox的搜索框吗?当您调整FF大小时,您将看到只有输入框正在调整大小,而搜索按钮不可用。我想要同样的效果。 – Zack 2012-02-22 18:35:11

回答

0

给你的搜索框(输入文本)一

大小调整:水平; 溢出:auto;

和最大调整大小:

最大宽度:YYYpx;

+0

您能否详细说明一下它将如何使输入框可调整大小? – 2012-02-22 09:40:30

+0

在这里,你去:http://www.w3schools.com/cssref/css3_pr_resize.asp – haco 2012-02-24 12:18:49

0

其实我并不清楚明白你的问题,但如果你想调整它,尝试使用媒体查询,与每一个不同宽度的div,你可以添加你想要你的输入准确的宽度,你可以采取例如如何建立一个搜索框,在这里简单:

Search box:

+0

对不起,也许我不够清楚。看看FireFox搜索框,当您调整整个窗口的大小时,搜索框会缩小,并且搜索图标会随之一起流动。这就是我想要的。当我将搜索框的宽度设置为85%会调整大小,但正如你所看到的,在一定的尺寸下,它会使图标突破线条:http://jsfiddle.net/L8Wp3/68/ – Zack 2012-02-22 18:41:15

+0

添加图像是描述你的最佳方式想! – 2012-02-23 05:49:01