मुझे एक अजीब समस्या है। मैं छवि के चारों ओर सीमा रखना चाहता हूं, लेकिन यह नीचे कुछ जगह दिखा रहा है। कृपया यहां एक नज़र डालें: http://jsfiddle.net/4WKJY/ मैं निश्चित ऊंचाई और चौड़ाई नहीं रखना चाहता हूं। किसी भी मदद के लिए धन्यवाद।छवि के आसपास अजीब पैडिंग समस्या
उत्तर
आप अपने सीएसएस, as seen here में img display:block
बनाकर इसे ठीक कर सकते हैं।
वैकल्पिक रूप से, सीएसएस केवल छवियों के लिए लागू:
.thumb img{
position: relative;
padding:2px;
float: left;
margin: 0px 0px 5px 5px;
border: solid 1px #ccc;
}
अन्य जवाब के विपरीत, यह मार्कअप में सफेद स्थान के साथ कोई संबंध नहीं है, और सफेद स्थान को निकाल इसे ठीक नहीं होगा।
समस्या यह है कि छवियां डिफ़ॉल्ट रूप से इनलाइन हैं और लंबवत संरेखण के लिए प्रारंभिक मान baseline
है। इसका मतलब है कि छवि का इलाज इस प्रकार किया जाता है कि यह पृष्ठ का कोई अन्य पाठ घटक था, और अंतरिक्ष अवरोधकों के लिए पाठ्य सामग्री के नीचे आरक्षित है - लोअरकेस 'जे' आदि जैसे अक्षरों पर पूंछ
इसे ठीक करने के लिए, आप या तो प्रतिपादन इंजन को बताने की आवश्यकता है कि छवि को पाठ्य सामग्री की तरह नहीं माना जाना चाहिए - .thumb img { display: block; }
यह करेगा - या आप रेंडरिंग इंजन को बता सकते हैं कि अवरोधकों के लिए स्थान आरक्षित नहीं किया गया है, और इसके बजाय सामग्री को बहुत नीचे संरेखित करें - .thumb img { vertical-align: bottom; }
करेगा इस।
संपादित करें: मुझे लगता है कि इंटरनेट एक्सप्लोरर के पुराने संस्करण गलत तरीके से व्हाइटस्पेस को संभालते हैं, इसलिए व्हाइटस्पेस को हटाकर इसका असर हो सकता है, लेकिन मैंने जो भी कहा वह अभी भी खड़ा है; व्हाइटस्पेस को हटाने से इस समस्या के लिए एक क्रॉस-ब्राउज़र फिक्स नहीं है।
ठीक है आप हैं; उम्मीद है कि ओपी आपके उत्तर में स्वीकार कर देगा। मैंने अपने जवाब से गलत जानकारी हटा दी है। – Phrogz
+1 - अच्छी व्याख्या! –
यह मुझे सुबह सुबह नट चला रहा था, ठीक और महान स्पष्टीकरण के लिए धन्यवाद! – brooklynsweb
बहुत बहुत धन्यवाद। – John
क्या आप सटीक हो सकते हैं कि 'अंतरिक्ष को हटाने' से आपका क्या मतलब था? बस एक ही पंक्ति में कोड की व्यवस्था करने से –
@denisk की मदद नहीं होती है, समस्या का सफेद स्थान के साथ कुछ लेना देना नहीं है, यह मेरा जवाब देखें कि यह क्यों हो रहा है और इसे कैसे ठीक किया जाए। – Jim