Текстовое поле занимает всю строку

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 css.

.searchField 
{
     max-width: 10px;
}

Answer 3

Изменить свойство width.

#searchBar { 
  width: 10px; 
}

Answer 4

'size' - недопустимое свойство css. Вместо этого используйте ширину. Например, введите ширину 100 пикселей, 10 пикселей - слишком мало. Вы также можете взглянуть на Размер ввода против ширины

Answer 5

Я никогда не слышал о size свойстве CSS.Вы имеете в виду width (скажем width: 10px)?