2011-01-02 12 views
29

यह मेरा एचटीएमएल है। नीचे दी गई तालिका एक कंटेनर div के अंदर है जिसमें 670px की चौड़ाई तय की गई है। अब मुझे यकीन नहीं है कि इस तालिका को कंटेनर की पूरी चौड़ाई कैप्चर करने के लिए कैसे आगे बढ़ना है।मैं स्टाइल टेबल को कंटेनर की पूरी चौड़ाई के लिए कैसे बना सकता हूं और कोशिकाओं को चौड़ाई के प्रतिशत का उपयोग कर सकता हूं?

.table_fields { 
    display: block; 
    background: #fff; 
    border: 1px solid #dce1e9; 
    border-bottom: 0; 
    border-spacing: 0; 
} 

.table_fields .table_fields_top {background: #f1f3f6;} 
.table_fields .table_fields_top td{ 
    font-size: 10px; 
    text-transform: uppercase; 
} 

.table_fields td { 
    text-align: center; 
    border-bottom: 1px solid #dce1e9; 
    border-right: 1px solid #dce1e9; 
    font-size: 11px; 
    line-height: 16px; 
    color: #666; 
    white-space:nowrap; 
} 

मैं चौड़ाई सेट करने की कोशिश की:

<table class="table_fields"> 
    <tr class="table_fields_top"> 
     <td><?php _e('Published','news'); ?></td> 
     <td><?php _e('Story','news'); ?></td> 
     <td><?php _e('Views','news'); ?></td> 
     <td><?php _e('Comments','news'); ?></td> 
     <td><?php _e('Rating','news'); ?></td> 
    </tr> 
</table> 

यह मेरा सीएसएस है 100%; लेकिन यह खाली रिक्त स्थान लौटा लेकिन टीडी संतुलित नहीं हैं। मुझे नहीं पता कि टीडी हमेशा अंतरिक्ष का 100% कैसे पूरा करें। मैंने चौड़ाई निर्धारित करने की कोशिश की: प्रत्येक टीडी के लिए 20% क्योंकि वे 100% चौड़ाई प्राप्त करने के लिए 5 टीडी हैं। लेकिन यह काम नहीं किया। क्या कोई मुझे बता सकता है कि कोशिकाओं को 100% तालिका की पूर्ण चौड़ाई में फिट करने के लिए कैसे करें (प्रत्येक टीडी के पास 20% की चौड़ाई का निश्चित प्रतिशत है) कृपया।

उत्तर

64

मुझे लगता है कि आपकी समस्या यह है कि आपके पास display: block तालिका के लिए डिफ़ॉल्ट प्रदर्शन मोड ओवरराइड कर रहा है (जो table है)। इसे हटाएं, और उसके बाद तालिका में width: 100% लागू करने का प्रयास करें।

+0

हाँ! यह बात है!!! –

संबंधित मुद्दे

 संबंधित मुद्दे