मैंने इस पोस्ट को पहले ही देख लिया है और अपने प्लेसहोल्डर के लिए पैडिंग को बदलने के लिए मैं जो कुछ भी कर सकता था, कोशिश की, लेकिन ऐसा लगता है कि यह सिर्फ सहयोग नहीं करना चाहता है।
वैसे भी, यहाँ सीएसएस के लिए कोड है। ( EDIT : यह 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 के लिए मूल है यदि जॉन विंडोज़ का उपयोग कर रहा है)