Я вже бачив цю публікацію і спробував усе, що міг, щоб змінити накладки для свого заповнювача, але на жаль, схоже, він просто не хоче співпрацювати.
У всякому разі, ось код для css. ( EDIT : Це створений css від sass)
#search {
margin-top: 1px;
display: inline;
float: left;
margin-left: 10px;
margin-right: 10px;
width: 220px;
}
#search form {
position: relative;
}
#search input {
padding: 0 10px 0 29px;
color: #555555;
border: none;
background: url('/images/bg_searchbar.png?1296191141') no-repeat;
width: 180px;
height: 29px;
overflow: hidden;
}
#search input:hover {
color: #00ccff;
background-position: 0px -32px;
}
А ось простий html:
<div id="search">
<form>
<input type="text" value="" placeholder="Search..." name="q" autocomplete="off" class="">
</form>
<div id="jquery-live-search" style="display: block; position: absolute; top: 15px; width: 219px;">
<ul id="search-results" class="dropdown">
</ul>
</div>
</div>
Досить просто? заповнювач заповнення з якоїсь причини відключений, але коли ви намагаєтеся ввести поле введення, текст вирівнюється. Здається, ви можете змінити лише колір (для webkit
) заповнювача, але якщо я спробую відредагувати прокладки, що містять вхід, це руйнує дизайн вводу! витягує волосся
Ось екрани заповнювача та поле введення з текстовим введенням:
Редагувати :
Поки що я вдався до цього плагіна jquery .
Це працює прямо з коробки, і це вирішує проблему мого хрому. Я все одно хотів би розкрити, в чому проблема (якщо вона пов'язана з моїм хромом чи чимось)
Я впевнений, що це не стилі, оскільки Джон Кеттерфельд відтворив це без проблем, тож сподіваюся, що хтось там все-таки може вказати мені на правильний напрямок, чому це відбувається зі мною (також хром мого клієнта. Отже. це, мабуть, є рідним для Chrome / OSX, якщо Джон використовує Windows)