عرض المسألة مع تحويلة.لوحة bbar في IE 6

https://stackoverflow.com/questions/90181

01-07-2019
|

سؤال

لقد واجهت عرض خلل في IE6 مع ExtJS الإطار.- آمل شخص يمكن لي نقطة في الاتجاه الصحيح.

في المثال التالي ، bbar لوحة عرض 2ems أضيق من لوحة تعلق (إنه محاذاة اليسار) في IE6 ، حيث كما هو الحال في فايرفوكس هو عرضها نفس عرض الفريق.

أي شخص يمكن أن تشير إلى كيفية حل هذه المشكلة ؟

لا يبدو أن تكون قادرة على العمل إما عن طريق تحديد عرض لوحة في ems أو الحشو في بكسل ، ولكن أعتقد أنه سيكون من المتوقع أن تعمل كما يجب أدناه.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css"/>
    <script type="text/javascript" src="ext/ext-base.js"></script>
    <script type="text/javascript" src="ext/ext-all-debug.js"></script>
    <script type="text/javascript">

    Ext.onReady(function(){        
        var main = new Ext.Panel({
            renderTo: 'content',
            bodyStyle: 'padding: 1em;',
            width: 500,
            html: "Alignment issue in IE - The bbar's width is 2ems less than the main panel in IE6.",
            bbar: [
                    "->",
                {id: "continue", text: 'Continue'}
            ]
        });
    });

    </script>
</head>
<body>
    <div id="content"></div>
</body>
</html>

المحلول

المشكلة يأتي من العرف bodyStyle الحشو.يجعل الفريق المحتوى أكبر, ولكن ليس على شريط الأدوات.

أحد الحلول الممكنة هو مواصلة عش وجود تحويلة الفريق, مثل:

    var main = new Ext.Panel({
        renderTo: 'content',
        width: 500,
        items: {
            bodyStyle: 'padding: 1em;',
            border: false,
            html: "Now alignment is fine."
        },
        bbar: [
                "->",
            {id: "continue", text: 'Continue'}
        ]
    });

الحدود:كاذبة اللازمة لتجنب المزدوجة المطلة.

نصائح أخرى

ربما عليك أن تحاول أن القوة عرض bbar:

main.getBottomToolbar().setWidth(500)

بعد لوحة الخلق ؟

ولكن أعتقد أن المشكلة هي أن bbar هو المقدمة إلى الداخلية div الفريق لذا مختلف المتصفحات تفسير الخارجي الحشو بشكل مختلف.

أيضا يمكنك محاولة مجموعة padding من bbar إلى -1em.

مرخصة بموجب: CC-BY-SA مع الإسناد

لا تنتمي إلى StackOverflow