तालिका पंक्ति पृष्ठभूमि छवि

Question

संभव डुप्लिकेट:
Can we solve the table row background image problem, in chrome, in multi celled tables?

मैं पहली पंक्ति के लिए पृष्ठभूमि के रूप में एक छवि के लिए कोशिश कर रहा हूँ। समस्या यह है कि पृष्ठभूमि प्रत्येक सेल पर अलग-अलग लागू होती है, पूरी तरह से नहीं। क्या इसके आसपास कोई रास्ता है?

http://jsfiddle.net/bumpy009/c3txj/

परिणाम कुछ इस तरह दिखना चाहिए:

संपादित करें: समस्या केवल सफारी, ओपेरा और क्रोम में दिखाई देता है। अभी तक आईई की जांच नहीं की।

Answer 1

यदि आप इसे प्रत्येक पंक्ति में चाहते हैं, तो इसे टेबल पृष्ठभूमि क्यों न बनाएं और इसे वाई-अक्ष में दोहराएं?

table { 
    width: 300px; 
    background-image: url('mypic.jpg'); 
    background-repeat: repeat-y; 
} 

बीटीडब्ल्यू मैंने आईई 9, एफएफ 12 के साथ अपने कोड का परीक्षण किया - वे प्रति पंक्ति एक बार छवि दिखा रहे हैं। लेकिन क्रोम 15 & सफारी 5 प्रत्येक टीडी के लिए इसे दोहरा रहा है।

संपादित

के बाद से आप केवल प्रथम-पंक्ति में यह चाहते थे, तो आप पृष्ठभूमि स्थिति का उपयोग करना चाहिए यकीन है कि छवि तालिका के शीर्ष पर रहता है (जहां पहली पंक्ति, सही है कि आम तौर पर है?: पी)

table { 
    width: 300px; 
    background-image: url('mypic.png'); 
    background-repeat: no-repeat; 
    background-position: center top; 
} 

Answer 2

मुझे आपकी सेल चौड़ाई के बारे में पता नहीं है (वे परिवर्तनीय हैं?), लेकिन तालिका तत्व इस तरह प्रस्तुत करते हैं। कि अब तुम हालांकि, टीडी और वें तत्वों के लिए चौड़ाई निर्धारित करने की आवश्यकता

tr {display: block;} 
td, th {display: inline-block; background: transparent;} 

आप देखेंगे,: वांछित प्रभाव प्राप्त करने के लिए, वे कुछ और के रूप में प्रदर्शित किया जाना चाहिए।

Demo देखें।