javascript - 输入字段调整大小

Question

我在调整搜索输入栏的大小时遇到​​了问题。我已经设法在浏览器窗口变小时使用 width:100%; 调整它的大小。但是我无法将起始宽度设置为 300px，除非它始终为 300px，然后在调整大小时它会超出父 div。出于某种原因，它是 185px；

Here's the jsfiddle of my set-up.

Answer 1

您正在通过调用 $('.search2').typeahead 将您的 input 嵌入到 span 中。此 span 具有未设置为 width: 100%;

的 css 类 twitter-typeahead

将此添加到您的 CSS:

.twitter-typeahead {width: 100%;}

然后您需要将您的 div 容器 css 更改为此 (width: 100%; max-width: 300px;):

.div2 {
  float: left;
  width: 100%;
  max-width: 300px;
  padding-left: 20px;
}

在 input 上保留 width: 100%; 没问题!

查看工作代码:http://jsfiddle.net/utg4mh6z/1/