सीएसएस तालिका स्तंभ चौड़ाई: तय - गतिशील (30%) - गतिशील (70%) - निर्धारित

Question

मैं तालिका लेआउट इस तरह का ही प्राप्त कर सके:

तय - गतिशील (50%) - गतिशील (50%) -

http://jsfiddle.net/ihtus/ksucU/

तय लेकिन मैं इस तरह कैसे मिलता है? निश्चित - गतिशील (30%) - गतिशील (70%) - निर्धारित

धन्यवाद।

Answer 1

इस तरह

:

<table> 
    <tr> 
     <td style="width:200px;"> 
     200px width - content 
     </td> 
     <td width="30%"> 
     dynamic width - content 
     </td> 
     <td width="70%"> 
     dynamic width - content 
     </td> 
     <td style="width:100px;"> 
     100px width - content 
     </td> 
    </tr> 
    </table> 

table { 
    width:100%; 
    border-collapse:collapse; 
    table-layout:fixed; 
} 

td { 
    border: 1px solid #333; 
} 

http://jsfiddle.net/7dSpr/

Answer 2

सामान्य दृष्टिकोण एक समान रूप में एक Monkieboy इस्तेमाल किया है, लेकिन आप इनलाइन शैलियों से बचना चाहिए। (इसके द्वारा मेरा मतलब है कि आपकी HTML फ़ाइल में style="someting") लिखना। आपको इसके बजाय कक्षाएं और सीएसएस का उपयोग करना चाहिए।

सबसे पहले इस <td class="thin-column">text here</td> तरह टीडी एक वर्ग देते हैं, फिर अपने सीएसएस प्रयोग में है कि शैलियाँ लागू करने: .thin-column:{ width: 30% }