html - Why Do Resized Images in Firefox Get A Black Line Under Them? -

यदि आप निम्न छवि लेते हैं:

  http: //ecx.images-amazon .com / images / I / 41uxky7oT8L._SL160_.jpg  

इसे किसी आईएमजी टैग के साथ एक HTML फ़ाइल में रखें, फिर इसे चौड़ाई 160 में बदल दें, लेकिन ऊंचाई सेटिंग सेट न करें, और फ़ायरफ़ॉक्स पर, आपको छवि के नीचे एक बदसूरत काली रेखा दिखाई देगी।

उदाहरण के लिए:

  & lt; img src = "http: //ecx.images-amazon। Com / images / I / 41uxky7oT8L._SL160_.jpg "alt =" "width =" 160 "/ & gt;  

या

<पूर्व> & lt; img src = "http://ecx.images-amazon.com/images/I/41uxky7oT8L._SL160_.jpg" Alt = "" शैली = "चौड़ाई: 160px;" / & Gt;

(ध्यान दें कि यदि यह मायने रखता है, तो मैं उबंटू लिनक्स 8.04 एलटीएस पर एफएफ 3.6.3 का उपयोग कर रहा हूं।)

नोट: मैं ऊंचाई निर्धारित नहीं करना चाहता हूँ क्योंकि तब छवि अजीब लगती है जब मैं जो करना चाहता हूँ, वह चौड़ाई बदल देती है ताकि अमेज़ॅन उत्पादों के एक स्तंभ में अच्छी तरह से फिट हो। साथ ही, मैं हमेशा छवि की ऊँचाई का सटीक अनुमान नहीं लगा सकता, और छवि का निरीक्षण करने के लिए कुछ एपीआई एक वेबसाइट को बहुत ज्यादा धीमा कर दे।

तो, आपको लगता है कि काली रेखा दिखाई दे रही है, और मैं प्रोग्रामेटिक रूप से क्या कर सकता हूं एचटीएमएल या सीएसएस में इसे रोकने के लिए? नोट: मैंने पहले ही #FFF को छवि के लिए पृष्ठभूमि-रंग की शैली सेट करने का प्रयास किया है और मुझे अभी भी यह समस्या है।

ब्राउजर द्वारा विरूपण को रोकने के लिए जावास्क्रिप्ट के साथ छवि का आकार बदलें। मैं ऐसा करता हूं क्योंकि केवल ओपेरा और क्रोम को "चिकनी आकार" बड़ी छवियों को छोटे आकार में।