文本字段占用整行

Question

我有一个文本字段，它将整个水平距离扩展到我不想要的窗口。我试过用我能想到的任何方式限制尺寸：

<input class="searchField" id="searchBar" style="size:10;" type="text" size="10px" value="Search Here" />

使用CSS：

#searchBar input
{
    width:10px;
}

.searchField 
{
    size:10px;
}

其他HTML / CSS代码可能会导致它一直扩展。我的问题：有没有办法覆盖它，以便在输入文本字段本地，我可以有自己的大小，比如10像素？

Answer 1

如果只是在其他地方使用不同的宽度属性进行定位，请使用

.searchField { width:10px !important; }

Answer 2

更改width属性。

#searchBar { 
  width: 10px; 
}

Answer 3

尝试使用width css属性。

.searchField 
{
     max-width: 10px;
}

Answer 4

我从未听说过size CSS属性。您的意思是width（说width: 10px）？

Answer 5

'size'是无效的css属性。请改用宽度。例如，输入宽度为100px，10px太小了。您可能还想查看Input size vs width