समस्या बोल्ड पाठ और डबल सीमाओं

Question

मुझे किसी साइट पर काम कर रहा हूँ और मैं कुछ समस्याओं का है कि मुझे आशा है कि आप लोग मुझे :)

1. साथ मदद कर सकते हैं अगर मैं पर बोल्ड कर दिया है साथ क्रोम बनाम मेरी मेनू में टेक्स्ट फ़ायरफ़ॉक्स में बहुत बोल्ड दिखता है: एस, लेकिन यह क्रोम में ठीक दिखता है।

2. फ़ायरफ़ॉक्स में # सामग्री कंटेनर पर डबल सीमा छाया प्रभाव के बाहर है: एस, लेकिन क्रोम में अच्छा दिखता है।

Screen shot मैक फ़ायरफ़ॉक्स 5.0.1 और क्रोम 13.0.782.112 पर:

This मेरी परियोजना है।

मुझे उम्मीद है कि कोई मेरी मदद कर सकता है।

आप कुछ मैं बेहतर मैं क्या कर सकता है, मैंने सुना है कि करने में खुशी होगी वह भी :)

Answer 1

आपका पहला ब्राउज़रों के बीच अलग अलग की तलाश में bold फॉन्ट के बारे में इस मुद्दे को सिर्फ इसलिए कि जिस तरह से ब्राउज़रों के है पाठ को अलग-अलग प्रस्तुत करें। इसके बारे में आप कुछ भी नहीं कर सकते हैं, जब तक आप इसके बजाय छवियों का उपयोग करने का भयानक मार्ग नहीं जाते।

आपका दूसरा मुद्दा border पर नहीं बल्कि outline है। box-shadow लागू होने पर फ़ायरफ़ॉक्स outline के तरीके के कारण होता है। यह इसके बजाय छाया के बाहर लागू होता है।

@-moz-document url-prefix() { 
    #content{ 
     outline-offset: -11px; 
    } 
} 

लाइव उदाहरण: http://jsfiddle.net/tw16/n8bet/

Answer 2

@ 1: वहाँ हर ब्राउज़र में फ़ॉन्ट रेंडरिंग में मतभेद। आप परिणाम को संकीर्ण करने के लिए बस बोल्ड होने के बजाय संख्यात्मक मानों का प्रयास कर सकते हैं (http://clagnut.com/blog/2228/)। Same font except its weight seems different on different browsers

@ 2: इसके अलावा इस एसओ प्रवेश पर जवाब पढ़ें #content सीएसएस से इस लाइन को हटा दें:

outline: 1px solid #B9BDBE;