<td> के अंदर एक सेल (<table>) के अंदर टेक्स्ट-एलाइन करें

Question

यहां कुछ ऐसा है जो मैंने कभी नहीं सोचा था कि मैं कहूंगा: मुझे फ़ायरफ़ॉक्स और क्रोम में कोई समस्या है, लेकिन यह आईई में ठीक काम कर रहा है!

यह बहुत सरल है, लेकिन मुझे समझ नहीं आता क्यों यह काम नहीं करता:

मैं एक सेल के अंदर एक मेज है, और मुझे सेल पर style="text-align:right" है, लेकिन तालिका फ़ायरफ़ॉक्स में छोड़ दिया जाता है और रहने क्रोम (आईई में यह आज्ञाकारी रूप से सही पर जा रहा है ...)। अगर मैं सेल टैग में align = right डालता हूं तो यह काम करता है, लेकिन मैं ऐसा नहीं करना चाहता।

कोड मूल रूप से है:

<table width="1000" border="1" cellpadding="0" cellspacing="0"> 
<tr> 
<td style="text-align:right"> 

<table border="1"> 
<tr><td>Hello</td><td>Hello 2</td></tr> 
</table> 

</td> 

<td>Hello 2</td></tr> 
</table> 

मैं नेस्टेड तालिका चौड़ाई होने के लिए = 100% या ऐसा कुछ नहीं चाहता ...

किसी को भी मुझे समझा कृपया सकते हैं कारण है कि यह 'नहीं करता है टी काम, और इसे कैसे ठीक करें, और शायद यह आईई में क्यों काम करता है लेकिन फ़ायरफ़ॉक्स या क्रोम नहीं?

Answer 1

मेरा अनुमान है कि क्रोम और एफएफ वास्तव में इसे सही तरीके से प्रस्तुत कर रहे हैं। text-align शायद table तत्वों को प्रभावित नहीं करना चाहिए। हालांकि, तालिका में float:right लागू करने से आप जो चाहते हैं वह करेंगे।

Answer 2

मैं यह जोड़ना चाहता हूं कि इसके कंटेनर से संबंधित तालिकाओं को संरेखित करने के लिए सीएसएस तरीका मार्जिन संपत्ति के साथ है।

यदि आप इसे केंद्र में संरेखित करना चाहते हैं, या margin-left: auto; यदि आप इसे दाईं ओर संरेखित करना चाहते हैं तो आपको margin: 0 auto; जोड़ना होगा।

@maxedison कहते हैं, text-aligninline और inline-block तत्वों के साथ ही काम करेगा, इसलिए अन्य समाधान अपने भीतर तालिका बदलने उन प्रदर्शन मूल्यों के कुछ लेने के लिए है।

तुम भी याद रखना आवश्यक है (इस तरह के पाठ के भीतर के रूप में अपनी इनलाइन सामग्री को प्रभावित करने के लिए एक p के लिए लागू) 'कंटेनर करने वाली सामग्री', इसका मतलब यह सामान्य रूप से एक कंटेनर के लिए लागू किया जाता है इसकी सामग्री को प्रभावित करने से text-align काम करता है , और margin: 0 auto 'सामग्री-से-कंटेनर' से काम करता है, जिसका अर्थ है कि यह सामान्य रूप से ब्लॉक तत्व पर लागू होता है और इसके कंटेनर से संबंधित स्थिति को प्रभावित करता है (div पर इसके माता-पिता को केंद्र में लागू करने के लिए लागू होता है)।

Answer 3

आप (पूर्ण कार्यक्षमता के साथ नहीं) इसे ठीक करना चाहते हैं, तो आप इस लिख सकते हैं:

table { 
    display: inline-block; 
} 

यह अपनी मेज, text-align: center; साथ केंद्रित किया जाना है, तो पेरेंट तत्व (रों) के लिए आवेदन किया सक्षम बनाता है।

Answer 4

जब आप div तैरता हुआ नहीं करना चाहते, तो आप इस कोशिश कर सकते हैं: http://jsfiddle.net/NvEZ8/

<div style="text-align:right;"> 
    <table style="display:inline-block"> 
     <tbody> 
     <tr> 
      <td></td> 
      <td>one</td> 
      <td>two</td> 
     </tr> 
     </tbody> 
    </table> 
</div> 

यह (एक DOCTYPE html) के साथ पाठ के अनुरूप की तरह दिखता है केवल क्रोम और में इनलाइन-ब्लॉक को प्रभावित करता है केवल तत्व ही इनलाइन नहीं है। ऑनलाइन इनलाइन द्वारा इनलाइन-ब्लॉक को प्रतिस्थापित करना और यह अब मेरे क्रोम