सीएसएस का उपयोग कर टेबल चौड़ाई को पूरी चौड़ाई कैसे लेना है?

Question

मैं टेबल मोबाइल उत्तरदायी के साथ एक साइट बना रहा हूँ। मैं टेबल टीडी को सीएसएस का उपयोग कर पूरी पूर्ण चौड़ाई (100%) कैसे ले सकता हूं?

<table> 
    <tr> 
     <td>Column One</td> 
     <td>Column Two</td> 
    </tr> 
</table> 

एक दूसरे के करीब दो कॉलम में जानकारी पढ़ना बहुत मुश्किल है।

Answer 1

सबसे पहले, आप सुनिश्चित करें कि आपके तालिका 100% चौड़ाई है बनाने की जरूरत है, तो आप वें और टीडी के साथ भी ऐसा कर सकते हैं

table, td { 
    width: 100%; 
} 

संपादित करें: क्योंकि आप अपने मूल पोस्ट संपादित, आप देना चाहिए पहले टीडी एक वर्ग

<td class="first"> 

td.first { 
    width: 100%; 
} 

यह पहला स्तंभ यह कर सकते हैं और दूसरा टीडी बस विस्तृत सामग्री के लिए पर्याप्त होगी के रूप में पेज के रूप में ज्यादा उपयोग करने के लिए कारण होगा। यदि आप अपने टेक्स्ट को लपेटना या कुछ नहीं चाहते हैं तो आपको इसे चौड़ाई भी देनी पड़ सकती है।

td {display:block;width:99.9%;clear:both} 

या, के रूप में @nux से चिह्नित किया गया,

td {display:block; box-sizing:border-box; clear:both} 

या तो पर्याप्त होना चाहिए, हालांकि माइक्रोसॉफ्ट ब्राउज़र आप उपकृत और नहीं होगा:

Answer 2

यह कोशिकाओं अन्य नीचे एक दिखाएगा उन लोगों के लिए मालिकाना मार्कअप की आवश्यकता हो सकती है; फिर फिर अगर लोग अपने फोन पर ब्राउज़र का उपयोग करने की योजना बनाते हैं तो वे एक माइक्रोसॉफ्ट फोन नहीं खरीदेंगे, इसलिए समस्या मामूली है।