فايرفوكس 3 خط الطول

Question

فايرفوكس 3 جديدا السلوك الذي خط الطول عند ضبطه ، يختلف من المتصفحات الأخرى تجعل ذلك.وهكذا مقطع حرج ربما تجعل عالية جدا في هذا المتصفح.وضع العالمية نسبة لا يعمل, لأنه أساس مختلف.وضع unitless قيمة مثل "1" لا يعمل ايضا.هل هناك طريقة لتطبيع هذا البعد ؟

Answer 1

محسوب قيمة line-height: normal يختلف بين المنصات ، المتصفحات (و إصدارات مختلفة من نفس المتصفح, كما يمكنك الدولة), الخطوط, وحتى أحجام مختلفة من نفس الخط (انظر إريك ماير المادة).

وضع unitless قيمة مثل...

body {line-height: 1.2;}

...يجب أن العمل على تطبيع تباعد بين المتصفحات.إذا كان هذا لا يعمل, يمكنك توفير أكثر-وصف مفصل من الأنماط الخاصة بك?

من الصعب (المستحيل؟) للحصول على "بكسل الكمال" النتائج ، ولكن من أجل الحصول على النتائج التي يمكن التنبؤ بها ممكن, وأنا أحاول أن استخدام خط الطول التي تنتج جولة لطيفة القيمة عند مضروبا في حجم الخط.لا يمكننا أن نعرف وكيل المستخدم الافتراضي حجم الخط ، ولكن 16 بكسل هو شائع إلى حد ما.

body 
{
    font-size: 100%;
    line-height: 1.5;
}

إذا كان المستخدم العميل بدءا حجم الخط هو في الواقع 16 بكسل ثم خط الطول من 1.5 يخرج إلى لطيفة ، حتى 24 بكسل.المستخدمين يمكن تغيير حجم الخط الافتراضي أو الصفحة التكبير ، على الرغم من المتصفحات المختلفة لديها مختلف أساليب القياس الصفحة.ومع ذلك, أعتقد لقد كان نجاحا معقولا بالنسبة لمعظم المستخدمين.إذا كنت لا يمكن أن تجعل خط الطول يخرج بالضبط ، ثم أطلق النار قليلا فوق صحيح وليس أقل قليلا, لأن بعض المتصفحات يبدو أن اقتطاع قيم بدلا من جولة لهم.

لاحظ أيضا أنه إذا كنت تستخدم نسبة مئوية عن خط الطول انها تتصرف بشكل مختلف عندما تكون القيمة الموروثة.

body 
{
    font-size: 100%;
    line-height: 150%;
}

p
{
    font-size: 75%;
}

بدءا من قاعدة حجم الخط 16 بكسل, خط الطول سيتم 24 بكسل.داخل <p> العنصر حجم الخط يصبح 12 بكسل ، ولكن خط الطول لا لا تصبح 18 بكسل ، بل يبقى 24 بكسل.هذا هو الفرق بين line-height: 1.5 و line-height: 150%.عندما body {line-height: 1.5;} يتم استخدام خط الطول <p> هو 18 بكسل.

Answer 2

وعلى الاطلاق يوجد شيء يمكنك القيام به. كل متصفح له هناك طريقة لجعل CSS والمحتوى. يمكنك استخدام "ماستر" إعادة تعيين (كما يقترح cowgod)، ولكن حتى ذلك الحين، وهذا لن نهاية المطاف إلى إصلاح المشكلات المحاذاة. هم هناك بسبب جعل محرك الفعلي. أبل CSS إلى موقع الويب الخاص بك القائمة واختباره. قل لي إذا كان يجعل بكسل الكمال في جميع المجالات. انها لن تفعل ذلك.

والطريقة الوحيدة لتحقيق الواقع بكسل الكمال هو تنفيذ CSS محددة لمتصفحات معينة. موزيلا لديه @ -moz للوثائق و IE لها انها الخارقة الخاصة ولكن أيا من هذه هي جزء من المواصفات W3C، ونحن جميعا نعرف معايير مهمة. لذلك ليس كثيرا من خيار.

وكما قال ديفيد أعلاه، فإنه من الصعب. أنا أميل إلى الاعتقاد المستحيل في الواقع. وقضيت ساعات في محاولة، ثق بي! كادت أكثر من مرة جنون من يهمني أن العد. انها حبوب منع الحمل من الصعب ابتلاع، ولكن هناك فقط بأي حال من الأحوال من حوله، إلا إذا استخدم الجميع محرك التصفح نفسه (التي من شأنها أن تأخذ في الواقع الإنترنت قفزة كبيرة إلى الأمام في رأيي). أعني، فإنه لن يكون من الصعب أن صفعة مهما الواجهة التي تريد في المتصفح الخاص بك، طالما أنك المساعد [أبو بريص] [بكت] [مقطع] [ترايدنت] [مهما] للتعامل مع الخلفية ... منذ الخير تلك كلها مفتوحة المصدر، هل يمكن دمج المشاريع وحقا الحصول على الذهاب. الناس بحاجة إلى أن نتعلم للعب لطيفة معا.)

Answer 3

ويمكنك حل هذه:

وتعيين ارتفاع خط إلى 1، ثم صفر في النص باستخدام الحشو أعلى والحشو القاع، وتعيين الارتفاع إلى السيارات.

.zeroed_in_element {
    padding: 4px 2px 5px 2px;
    height: auto;
    line-height: 1;
} 

Answer 4

ويجب عليك دائما "إعادة تعيين" أساليب للقضاء على جميع التناقضات المتصفح مع أنماط العنصر.

إيريك ماير CSS إعادة تعيين . ياهو واحدة أيضا.