क्यों द्रव छवि बच्चे के साथ संबंध तालिका चौड़ाई IE नहीं है

Question

पर विचार करें the following code:

HTML:

<table> 
    <tr> 
     <td><img src="http://watduck.jpg.to" /></td> 
    </tr> 
</table> 

सीएसएस:

table { width: 10% } 
img { max-width: 100% } 

छवि स्पष्ट रूप से एक होना चाहिए खिड़की की चौड़ाई 10 वीं, जो आईई को छोड़कर हर ब्राउज़र में बिल्कुल ठीक है, जहां यह बस वापस आती है टीएस मूल आकार।

हालांकि

, consider this:

HTML:

<div><img src="http://watduck.jpg.to" /></div> 

सीएसएस:

div { width: 10% } 
img { max-width: 100% } 

जो आईई अधिकार मिलता है, और खिड़की चौड़ाई का एक 10 वीं में प्रदर्शित करता है। क्या इस व्यवहार का कारण बनता है, और क्या संभवतः तालिका की चौड़ाई का सम्मान करने के लिए IE के लिए मजबूर करने में किया जा सकता:

---

तो, यहाँ सवाल है?

आईई 8 & आईई 9 में परीक्षण (आईई 7 और नीचे की परवाह नहीं है)।

Answer 1

यदि आप तालिका सीएसएस में निर्दिष्ट करते हैं तो यह काम करता है।

तालिका लेआउट के संबंध में मानक में कुछ विरोधाभासी शब्दावली प्रतीत होती है। विशेष रूप से, table-layout: auto; इस कहते हैं:

स्तंभ चौड़ाई कोशिकाओं

चित्रों सामग्री अटूट है में व्यापक अटूट सामग्री द्वारा निर्धारित है, यह के आकार के सेल की चौड़ाई सेट सामग्री। अधिकतम चौड़ाई इसके द्वारा अतिप्रवाह प्रतीत होता है।