2012-01-17 18 views
8

मेरे पास एक सारणी है जहां स्तंभों की संख्या बदल सकती है (1 से 10 तक), एक कॉलम के अपवाद के साथ जो हमेशा एक निश्चित चौड़ाई पर रहना चाहिए ताकि कोई अतिरिक्त जगह न हो या यह लपेट न जाए (यह होगा तालिका में पंक्तियों को जोड़ने या हटाने के लिए उपयोग किया जाता है)।क्या मैं अपने एचटीएमएल टेबल हेडर में प्रतिशत चौड़ाई और पिक्सेल चौड़ाई मिश्रण कर सकता हूं?

तालिका 800px से अधिक नहीं होनी चाहिए, और मैं दाईं ओर एक सबमिट बटन सबमिट करना चाहता हूं।

क्या तालिका कॉलम चौड़ाई को प्रतिशत के रूप में बदलने के लिए कोई तरीका है, और एक स्थिर स्तंभ एक निश्चित पिक्सेल चौड़ाई के रूप में सेट कर रहा है? या इससे समस्याएं पैदा होंगी? मैंने कई अलग-अलग दृष्टिकोणों की कोशिश की है, लेकिन सभी उप-स्थानिक लगते हैं। क्या ऐसा करने का कोई शानदार तरीका है? मैंने संदर्भ के लिए एक तस्वीर संलग्न की है: http://bayimg.com/BAlLLaaDP

HTML: एक तालिका में पिक्सेल में चौड़ाई और प्रतिशत के साथ

पंक्तियों
<html> 
    <head> 
    <style> 
     #container { 
     width: 800px; 
     } 
     #table_container { 
     padding:5px; 
     } 
     #table_container table { 
     width: 85%; 
     } 
     .action { 
     } 
     col { 
     width:29%; 
     } 
     table { 
     width:650px; 
     table-layout: fixed; 
     float: left; 
     } 
    </style> 
    </head> 

<body> 
<div id="container" class="clearfix"> 

    <form> 
      <table class="" border=1> 
       <colgroup> 
        <col > 
        <col> 
        <col> 
        <col class="action"> 
       </colgroup> 
       <th>First Name</th> 
       <th>Last Name</th> 
       <th>Email </th> 
       <th></th> 
       <tr> 
        <td>content 1</td> 
        <td>content 2</td> 
        <td>content 3 </td> 
        <td><a href="">delete row</a> 
       </tr> 
       <tr> 
        <td>content 1</td> 
        <td>content 2</td> 
        <td>content 3 </td> 
        <td><a href="">delete row</a> 
       </tr> 
      </table> 
     <div class="mult_answer"> 
      <button class="button orange">Submit Answer</button> 
     </div> 
     </form> 

</div> 

</body> 
</html> 

उत्तर

5

नहीं हो सकता है अगर सभी पंक्तियों की कुल चौड़ाई 100% से अधिक नहीं है (पंक्तियों या मेज की तुलना में अधिक अनुसार बदल दिया जाएगा अगर फिट सामग्री)।
यदि आप चौड़ाई के उद्देश्य के लिए col का उपयोग कर रहे हैं तो आप चौड़ाई th तत्वों को जोड़ सकते हैं। चौड़ाई के बिना कम से कम एक कॉलम छोड़ना बेहतर है ताकि यह फिट हो सके।
पीएस मुझे समझ में नहीं आता है कि आपको td तत्व के लिए क्यों आवश्यकता है।

+0

धन्यवाद। मैंने टीडी तत्व के लिए चौड़ाई हटा दी, जिसे वहां नहीं माना गया था। – David