2011-04-07 14 views
8

मैं अपनी वेबसाइट का एक मोबाइल संस्करण डिजाइन कर रहा हूं, जो मोबाइल एप्लिकेशन की तरह होना चाहिए।मोबाइल वेबसाइट एचटीएमएल तत्व बहुत व्यापक

समस्या यह है कि मेरे मोबाइल ब्राउज़र में मेरे एचटीएमएल तत्व की एक अजीब चौड़ाई है। मैंने चौड़ाई के लिए शरीर और एचटीएमएल सेट करने की कोशिश की है: 480 पीएक्स; और सामग्री 480px है लेकिन फिर भी सामग्री के बगल में बहुत सी सफेद जगह है (लगभग 300px अनुमानित)। इसका प्रभाव यह भी है कि वेबसाइट सामग्री पर ज़ूम नहीं की गई है लेकिन सामग्री + व्हाइटस्पेस पर है और आपको पहले वेबसाइट का सही उपयोग करने के लिए ज़ूम इन करना होगा।

संभोग मैं चौड़ाई का उपयोग करना चाहता हूं: 100%; इसलिए यह विभिन्न स्क्रीन आकारों पर अच्छी तरह से प्रस्तुत करता है।

क्या किसी को पता है कि क्या हो रहा है या इसे कैसे ठीक किया जाए?

संपादित करें एचटीएमएल कोड सिर्फ सीधा है xhtml संक्रमणकालीन, कुछ विशेष नहीं है। सीएसएस में मेरे पास है:

body, html { 
width:480px !important;} 

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

+0

क्या आप कुछ कोड शामिल कर सकते हैं? शायद jsfiddle में एक उदाहरण? – quarkdown27

+0

हो गया, मेरी पोस्ट संपादित की। – Thomas

उत्तर

19

क्या आपने viewport मेटा टैग जोड़ा है?

<meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
+2

शानदार, यह काम करता है! आपका बहुत बहुत धन्यवाद! – Thomas

+0

अरे बहुत बहुत धन्यवाद। मैं इस –

+0

की तलाश में हूं, मैं विशेष रूप से इस कमांड की तलाश नहीं कर रहा था। मैंने सोचा कि यह एक स्टाइल शीट मुद्दा था। मैंने कमांड और बैंग डाल दिया। मेरे पृष्ठ की वास्तविक चौड़ाई फिट करने के लिए स्क्रॉल बार के साथ मेरे विस्तृत शरीर को ठीक करता है। –

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