2012-02-13 7 views
5

के रूप में क्यों लागू नहीं किया गया है मेरे पास नीचे दी गई तालिका है। दूसरी पंक्ति ने तीन कॉलम परिभाषित किए हैं, एक colspan=8 और colspan=1 वाले अन्य। फिर भी, कोशिकाओं को colspan के अनुसार फैलाया नहीं जाता है, "चौड़ाई" दूसरे सेल के लिए थोड़ा और तीसरे के लिए व्यापक है।कॉलस्पेन को

<table class="floating simpletable"> 
    <tbody> 
     <tr><td colspan="10">1st row</td></tr> 
     <tr><td colspan="8">Column 1 -&gt; Least wide</td><td colspan="1">2nd</td><td colspan="1">3rd</td></tr> 
     <tr><td colspan="10">3rd row</td></tr> 
     <tr><td colspan="1">1st cell</td><td colspan="9">4th row</td></tr> 
    </tbody> 
</table> 

समस्या क्या है और इसे ठीक करने का तरीका क्या है?

+0

10 कोशिकाओं वाली पंक्ति कहां है? – ZippyV

+0

यह पहली पंक्ति है। क्या मुझे किसी भी तरह से 10 कोशिकाओं के साथ पंक्ति को परिभाषित करना है? – Nicsoft

+1

-1 क्या के लिए? कृपया टिप्पणी करें! – Nicsoft

उत्तर

5

कोशिकाओं की चौड़ाई चौड़ाई, ब्राउज़र और संभवतः चंद्रमा के चरण के लिए सेल सामग्री, एचटीएमएल और सीएसएस सेटिंग्स पर निर्भर करती है। colspan विशेषता केवल एक सेल पर कब्जा कर लिया है कि कितने कॉलम (इसलिए, तालिका के लिए ग्रिड में कितने स्लॉट) निर्दिष्ट करता है।

यदि आप पंक्ति 2 के अंतिम कक्ष को सबसे व्यापक के रूप में देखते हैं, तो शायद कारण यह है कि इसमें अधिकांश सामग्री है (या इसके लिए चौड़ाई सेटिंग है)। आपका डेमो कोड ऐसा व्यवहार प्रदर्शित नहीं करता है।

यदि आप कॉलम चौड़ाई को कोशिकाओं की आकार आवश्यकताओं में समायोजित नहीं करना चाहते हैं, तो चौड़ाई को सीएसएस (या HTML में) में स्पष्ट रूप से सेट करें। इससे पहले, तालिका संरचना से सभी अनावश्यक जटिलताओं को दूर करना सबसे अच्छा है। यदि आपका डेमो कोड पूरी संरचना को प्रतिबिंबित करता है, तो कॉलम 2 से 8 एक अनावश्यक विभाजन हैं, यानी उन्हें एक कॉलम में बदल दिया जा सकता है। प्रदर्शन (बस निश्चितता के लिए गरीब शैली पिक्सेल चौड़ाई के साथ):

<table class="floating simpletable" border> 
    <col width=100><col width=100><col width=100> 
    <tbody> 
     <tr><td colspan="4">1st row</td></tr> 
     <tr><td colspan="2">span 1</td><td>span 2</td><td>span 3 </td></tr> 
     <tr><td colspan="4">3rd row</td></tr> 
     <tr><td>span</td><td colspan="3">other span</td></tr> 
    </tbody> 
</table> 

इस तरह एक पुनर्लेखन के बिना, मुझे डर है कि अपनी मेज HTML की तालिका मॉडल का उल्लंघन करता हूँ, वर्तमान में कोई सेल कि कॉलम 3 में शुरू होता है के रूप में या कॉलम 4 या ...

+0

मेरा उदाहरण वास्तविक है जो काम नहीं कर रहा है। लेकिन आपके सुझाव में प्रत्येक कॉलम के लिए टैग जोड़ना हल हो गया है। मैंने उनमें से दस जोड़े और प्रत्येक के लिए चौड़ाई = 10% सेट किया। धन्यवाद! लेकिन आपके उदाहरण में आपने केवल तीन जोड़े, क्या आप उनमें से चार नहीं होना चाहिए क्योंकि आप colspan = 4 का उपयोग करते हैं? – Nicsoft

+0

मेरे डेमो में, अंतिम कॉलम बस इसकी आवश्यकता होती है। मुझे लगता है कि आप क्या सोच रहे हैं, इसे प्राप्त करने के लिए, आप (मेरे मार्कअप का उपयोग करते समय) ' 'का उपयोग कर सकते हैं। प्रत्येक 10% चौड़े दस स्तंभों का आपका दृष्टिकोण संभवतः मजबूत नहीं है, क्योंकि यह तालिका मॉडल समस्या को ठीक नहीं करता है। –

+0

ठीक है, मैं समझता हूं कि आपने आखिरी कॉल क्यों छोड़ा था। लेकिन तालिका मॉडल के बारे में पढ़ना, क्लाइंट को कॉलम की संख्या तय करने के लिए का उपयोग करना चाहिए, इसलिए मुझे लगता है कि प्रत्येक कॉलम के लिए होने में गलत नहीं है। क्या आप कृपया बता सकते हैं कि मेरा रास्ता आपके रास्ते के रूप में मजबूत क्यों नहीं है? शायद मुझे टेबल मॉडल की कुछ समझ नहीं है ... – Nicsoft

1

colspan निर्धारित करता है कि सेल कितने कॉलम ओवरलैप करता है, न कि उन स्तंभों का आकार। चीजों की चौड़ाई निर्दिष्ट करने के लिए सीएसएस width संपत्ति का उपयोग करें।

+0

यह वास्तव में कोशिकाओं में से कोई नहीं है जिसका अर्थ है, बस मेरा वाक्यांश जो शायद थोड़ा अस्पष्ट था। मैं इसे ठीक कर दूंगा। – Nicsoft

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