从输入字段宽度分离自动完成框的大小

Question

据我所知，谷歌的自动填充框的宽度始终与其所属的输入字段相同。

<input type="text" id="autoTest">

#autoTest{
  width: 40px;
}

结果：

和

#autoTest{
  width: 400px;

}

结果：

有什么办法可以实现更大的宽度，而无需更改输入字段的宽度。 因为在我看来这是没有选择的。 用户在选择一个完整的街道名称后，在输入字段中显示整个街道名称也无关紧要。

我感谢一个干净的解决方案，但是，如果那不可能，我也将采取一种解决方法。

Answer 1

使用选择器.pac-container将自定义样式应用于下拉菜单：

 function initialize() { new google.maps.places.Autocomplete(document.getElementById('autoTest')) } google.maps.event.addDomListener(window, 'load', initialize); 

 .pac-container { width: 400px !important; } #autoTest { width: 40px; } 

 <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&libraries=places"> </script> <input id="autoTest"/>