2012-10-08 23 views
10

के साथ ज़र्ब फाउंडेशन 3 का काम करना ज़बर के फाउंडेशन 3 फ्रेमवर्क को आई 7 के साथ काम करने के लिए एक समाधान प्रस्तावित किया गया है। जरूरी जटिल समर्थन नहीं, लेकिन निश्चित रूप से ग्रिड समर्थन। http://www.stormconsultancy.co.uk/blog/development/code-snippets/making-zurb-foundation-3-work-on-ie7/आईबी 7

मैं यहाँ इस दोहराने की कोशिश की है::

समाधान के रूप में प्रस्तुत किया जाता है http://sausag.es/foundation/grid.html

मैं अपने foundation.min.css में एचटीसी फ़ाइल के लिंक जोड़ दिया है

संदर्भ एचटीएमएल के सापेक्ष है, सीएसएस नहीं।

मैंने एचटीसी फ़ाइल के बारे में htaccess में एक पंक्ति जोड़ा है।

लेकिन फिर भी मैं आईई 7 में आईई 7 में दिखाने के लिए ग्रिड नहीं प्राप्त कर सकता क्योंकि यह आईई 8 में करता है। मुझसे कहां गलती हो रही है?

उत्तर

7

your stylesheet में निम्न पंक्ति:

*behavior: url(/stylesheets/box-sizing.htc); 

निम्न पते पर अनुवाद:

http://sausag.es/stylesheets/box-sizing.htc 

जो रिटर्न एक 404. आप के लिए लाइन को बदलने के द्वारा इसे ठीक कर सकते हैं:

*behavior: url(/foundation/stylesheets/box-sizing.htc); 

या box-sizing.htc फ़ाइल को एक फ़ोल्डर से नीचे ले जाकर।

+2

चेहरा। पाम। धन्यवाद एसीजे। मैं पेड़ों के लिए लकड़ी नहीं देख सका। – user1729819

7

एक और समाधान सशर्त टिप्पणियों के साथ IE7 पता लगाने के लिए और उसके बाद इस तरह स्तंभों के लिए एक सीएसएस सुधार लागू होगा:

.ie7 .columns{ 
    margin-right: -15px ; 
    margin-left: -15px ; 
    display:-moz-inline-stack; 
    display:inline-block; 
    zoom:1; 
    *display:inline; 
} 

इस स्तंभों पर गद्दी को साफ करता है और ग्रिड ठीक करता है। आप अन्य divs या लेआउट के हिस्सों पर भी ऐसा कर सकते हैं।

भी, आप केंद्रित कॉलम और इस तरह कॉलम ऑफसेट-से ठीक करने के लिए की आवश्यकता होगी:

.ie7 .row{ 
    clear: both; 
    text-align: center; 
} 

.ie7 .offset-by-three { 
    margin-left:25% !important; 
} 
.ie7 .offset-by-seven { 
    margin-left:58.33% !important ; 
} 

और निश्चित रूप से सशर्त टिप्पणियाँ:

<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ --> 
<!--[if IE 7]> <html class="ie7 oldie" lang="en"> <![endif]--> 
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]--> 
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]--> 
+0

धन्यवाद !! मेरे पास एक काफी सरल स्टाइल साइट है जिसमें केवल बड़ी संख्या में तत्व थे, और boxsizing.htc प्रदर्शन को नीचे खींच रहा था। यह इतना बेहतर प्रदर्शन-वार है, लेकिन यहां कुछ और चीजों को ठीक करने की आवश्यकता है। –