2010-10-08 14 views
11

आईपैड पर एचटीएमएल पेज प्रस्तुत होने पर मुझे सीएसएस समस्या है। सब कुछ अन्य ब्राउज़रों में अच्छा काम करता है। समस्या यह है कि मुझे मेरी टेबल में सेल्स के बीच एक छोटी सी जगह मिलती है जैसा कि आप चित्र में देख सकते हैं: http://oi53.tinypic.com/2vl0as9.jpgतालिका सीमा के साथ आईपैड पर सीएसएस मुद्दा

यदि मैं कोशिकाओं के बीच की रेखा पर अधिकतम पृष्ठ ज़ूम करता हूं, तो यह असफल हो जाता है .. तो यह होना चाहिए पृष्ठ प्रस्तुत होने पर किसी प्रकार की बग। क्या मैं इसे किसी तरह से घूम सकता हूं? यह मेरी मेज और सीएसएस है:

<table class="smallTable" cellpadding=0 cellspacing=0> 
    <tr> 
     <td class="td1"></td> 
     <td class="td2"></td> 
    </tr> 
    <tr> 
     <td class="td1"></td> 
     <td class="td2"></td> 
    </tr> 
</table> 

सीएसएस:

.smallTable 
{ 
    margin: 20px auto 40px auto; 
    border-spacing: 0; 
} 

.smallTable td 
{ 
    margin: 0; 
} 

.smallTable td.td1 
{ 
    background: url(../images/table1.png); 
} 

.smallTable td.td2 
{ 
    background: url(../images/table2.png); 
} 
+0

मेरे पास आईपैड प्रतिपादन के साथ एक ही समस्या है। मैं वेबकिट बाकग्राउंड भरता हूं और यह भी वही कर रहा है। –

उत्तर

0

यह वेब पर तालिका शैलियों के प्रबंधन की एक सामान्य अभ्यास है, और आपकी समस्या का समाधान करना चाहिए:

table { border-collapse: collapse; } 

और आप अपनी टेबल कोशिकाओं के लिए मार्जिन सेटिंग्स को हटा सकते हैं, वे कुछ भी प्रभावित नहीं करते हैं।

+0

सीमा स्टाइल में कोई बदलाव नहीं हुआ - यह मुद्दा सीमा पार नहीं हुआ है, यह सिर्फ – Iiridayn

7

मैं इसे मेटा टैग एचटीएमएल हेड में डालने में सक्षम था जब अनुरोध में iDevice (आईपॉड, आईपैड, आईफोन) का पता चला है।

<meta content='width=device-width; initial-scale=1.0;' name='viewport' /> 

उम्मीद है कि यह मदद करता है।

+3

दिलचस्प दृष्टिकोण प्रतीत होता है, लेकिन जब मैं थोड़ा ज़ूम करता हूं तो सीमा वापस आती है। –

3

यूरेका! मुझे एक समाधान मिला जो मेरे लिए काम करता था।

मेरे पास हल्की भूरे रंग की पृष्ठभूमि थी और यह ऐसा रंग प्रतीत होता था जो मेरी टेबल के चारों ओर सीमाओं के रूप में प्रकट हुआ था जो एक गहरा रंग था।

इसे ठीक करने के लिए आपको उन सभी टैग्स को रखना होगा जो सीमाओं से प्रभावित होते हैं जो खुद को एक ही रंग में एक ही रंग में प्रकट करते हैं।

यह कई चीजों की कोशिश करने के बाद काम किया। उम्मीद है कि यह

3

Zheileman का समाधान मेरे लिए काम करता है और अब मेरे टैब सीएसएस छवि पृष्ठभूमि के साथ आईपैड पर सही दिखता है। कार्रवाई में फिक्स के उदाहरण के लिए आईपैड पर http://www.meishapersonaltrainer.com पर शीर्ष मेनू टैब देखें।

मेरे पीएचपी जो पता लगाने करता है और मेटा कहते हैं इस

if (isset($_SERVER['HTTP_USER_AGENT'])) 
{ 
    $ua = strtolower($_SERVER['HTTP_USER_AGENT']); 
    if (strpos($ua, 'ipad') !== false || strpos($ua, 'ipod') !== false ||strpos($ua, 'iphone') !== false) 
    { 
     print '<meta content="width=device-width; initial-scale=1.0;" name="viewport" />'; 
    } 
} 
7

मैं सिर्फ आधे दिन इस बग के खिलाफ मेरे सिर कोसते एक HTML प्रारूपित ईमेल बनाने के लिए प्रयास करते हुए की तरह लग रहा है।

आईपैड के पास एक गैर 1: 1 स्केल पर टेबल देखने पर एक बग (गैसपी!) है। यह विशेष रूप से स्पष्ट है यदि आपकी तालिका के टीडी टैग में अंधेरा पृष्ठभूमि है और टैबलेट के माता-पिता के पास हल्का रंग है। Rowspans और colspans समस्या को बढ़ाते हैं।

मैंने शुरू में सोचा था कि समस्या यह थी कि आईपैड एक सीमा पेश कर रहा था।
वास्तविक समस्या यह है कि ऐप्पल के कोडर यह तय नहीं करते थे कि वे स्केलिंग के दौरान एक पिक्सेल अप के नीचे या नीचे समान रूप से गोल करने जा रहे हैं या नहीं।

इसलिए, कुछ टीडी टैग 100% पैमाने पर नहीं होने पर सीमा होने लगते हैं। जब वास्तव में यह केवल प्रकाश पृष्ठभूमि के माध्यम से दिखा रहा है।

समाधान तालिका को उसी तालिका में लपेटने के लिए है जो एक ही अंधेरे पृष्ठभूमि में है।

1998 वेब-डिजाइन में आपका स्वागत है। मैंने सुना mp3.com सभी क्रोध है। मुझे pet.com से कुछ मेल ऑर्डर कुत्ते के व्यवहार खरीदना होगा।

धन्यवाद आईपैड।

+1

अफसोस की बात है, मेरी तालिका पंक्तियां पृष्ठभूमि पृष्ठभूमि रंगों का उपयोग करती हैं और समायोज्य ऊंचाई सामग्री होती हैं, इसलिए पृष्ठभूमि रंग बदलने से मेरी स्थिति में मदद नहीं मिलती है :)। – Iiridayn

0

मैंने इसे एक अजीब तरीके से हल किया।

सबसे पहले मैंने सेल में सामग्री होने पर, इस समस्या का सामना करने वाले प्रत्येक सेल के अंदर <div> जोड़ा, फिर सुनिश्चित करें कि <div> उसके बाद है और सामग्री को लपेटता नहीं है। इसके बाद मैंने को <div> और ios-table पर किसी तालिका कक्ष (<td>) पर लागू किया।

फिर मैंने कुछ प्रश्नों को मीडिया प्रश्नों के अंदर लिखा जो आईपैड के स्क्रीन रिज़ॉल्यूशन को लक्षित करते हैं। सबसे पहले मैं जोड़ा ios-table के लिए निम्न:

bottom: -1px; 
left: -1px; 
position: absolute; 
right: -1px; 
top: -1px; 
z-index: 1; 

आप तालिका के अंदर किसी भी सामग्री को position: relative; और z-index: 2; लागू करना चाहते करने जा रहे हैं:

overflow: hidden; 
position: relative; 

अगला मैं ios-table-fix के लिए निम्न जोड़ा कोशिकाओं, अन्यथा वे गायब हो जाएंगे।

यह प्रभावी रूप से टेबल सेल के लिए एक नई पृष्ठभूमि खींचता है जो तालिका कक्ष के आकार को बदले बिना सीमा मुद्दे को बहता है। चूंकि यह केवल एक आईपैड मुद्दा है, इसलिए हम सब कुछ प्रभावित करने से बचने के लिए <head> टैग में सीएसएस का उपयोग कर सकते हैं।

मैंने केवल संक्षेप में इसका परीक्षण किया लेकिन यह कहीं और मुद्दों के बिना काम करने लगता है।

+0

इस के बाद से, मैंने विंडोज फोन में परीक्षण किया और ऐसा लगता है कि यह अभी भी सीमा मुद्दों से ग्रस्त है। –

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