Colspan 2.5 कॉलम फैल रहा है?

Question

मेरे पास 5 कॉलम वाली एक टेबल है। अंतिम पंक्ति में दो कोशिकाएं होंगी, जो समान रूप से दूरी पर होंगी।

आदर्श रूप से, मैं <td colspan="2.5"> का उपयोग करना चाहता हूं - ऐसा करने का सबसे शानदार तरीका क्या है?

मेज, 1 की एक सीमा है इसलिए का उपयोग कर

<td colspan=2">abc</td> 
<td></td> 
<td colspan=2">def</td> 

बदसूरत लग रहा है

Answer 1

तुम सच में नीचे पंक्ति में दो तालिका सेल या सिर्फ दो ब्लॉकों की ज़रूरत है कि पूरी पंक्ति की आधा चौड़ाई है? अगर उत्तरार्द्ध, तो आप अंतिम पंक्ति के लिए <td colspan="5"> बना सकते हैं, इसमें दो <div> रों शब्दों में कहें, छोड़ दिया और सही करने के लिए अन्य करने के लिए एक नाव है, और उन्हें width:50% दे:

<table> 
    <tbody> 
     <tr> 
      <td>1111</td> 
      <td>2222</td> 
      <td>3333</td> 
      <td>4444</td> 
      <td>5555</td> 
     </tr> 
     <tr> 
      <td colspan="5"> 
       <div class="first-half"> 
        half 
       </div> 
       <div class="second-half"> 
        half 
       </div> 
      </td> 
     </tr> 
    </tbody> 
</table> 

और कुछ सीएसएस:

.first-half { 
    float: left; 
    width: 50%; 
} 
.second-half { 
    float: right; 
    width: 50%; 
} 

और हमेशा की तरह jsfiddle: http://jsfiddle.net/ambiguous/mmZEa/

आप उन्हें जरूरत है तो आप क्षैतिज कोशिकाओं की संख्या दोगुनी हो सकती तालिका सेल होने के लिए करते हैं, तो सभी मौजूदा <td colspan="2"> करें, और उसके 012,305 का उपयोगनीचे पंक्ति में दो कोशिकाओं के लिए: http://jsfiddle.net/ambiguous/JzrLK/

Answer 2

इस

<table border="1"> 
    <tr> 
     <td>text</td> 
     <td>text</td> 
     <td colspan="2">text</td> 
     <td>text</td> 
     <td>text</td> 
    </tr> 
    <tr> 
     <td>text</td> 
     <td>text</td> 
     <td colspan="2">text</td> 
     <td>text</td> 
     <td>text</td> 
    </tr> 
    <tr> 
     <td>text</td> 
     <td>text</td> 
     <td colspan="2">text</td> 
     <td>text</td> 
     <td>text</td> 
    </tr> 
    <tr> 
     <td colspan="3">text</td> 
     <td colspan="3">text</td> 
    </tr> 
</table> 

क्रोम, Firefox और IE 7-9 पर ठीक काम किया जैसे कुछ प्रयास करें । (क्रोम, IE और Firefox में परीक्षण) https://jsfiddle.net/weyy601z/

Answer 3

यह अच्छी तरह से काम करने के लिए लगता है:: बेला

देखें

<table border="0" CELLPADDING="0" CELLSPACING="0"> 
<tr> 
    <td> 
     <table border="1" width="100%"> 
      <tr> 
       <td>abcsss</td> 
       <td>sdf</td> 
       <td>def</td> 
       <td>def</td> 
       <td>defsssss</td> 
      </tr> 
     </table> 
    <td> 
</tr> 
<tr> 
    <td> 
     <table border="1" width="100%"> 
      <tr> 
       <td width="50%">test</td> 
       <td width="50%">test</td> 
      </tr> 
     </table> 
    </td> 
</tr> 
</table>