Firefox addon XUL预处理窗口大小问题

Firefox addon XUL预处理窗口大小问题,firefox-addon,xul,Firefox Addon,Xul,我有一个带有的Firefox插件,用于控制我的插件的首选项。它包含两个独立的标签,用于在某些位置提供更多信息(见下文)。我在加载对话框时运行了一些JavaScript,以根据用户屏幕的尺寸设置CSSmax height和max width(我发现这是必要的,因为否则对话框将水平扩展到屏幕边缘,就像(其中CSSwordwrap:break-wordset-)放在一行上) 但是,当Firefox(v3.6和v4.0)显示prefwindow时,在设置了max width和max height之后,它

我有一个带有
的Firefox插件,用于控制我的插件的首选项。它包含两个独立的
标签,用于在某些位置提供更多信息(见下文)。我在加载对话框时运行了一些JavaScript,以根据用户屏幕的尺寸设置CSS
max height
max width
(我发现这是必要的,因为否则对话框将水平扩展到屏幕边缘,就像
(其中CSS
wordwrap:break-word
set-)放在一行上)

但是,当Firefox(v3.6和v4.0)显示prefwindow时,在设置了
max width
max height
之后,它只解释了一行描述,因此即使对话框有垂直扩展的空间,也有一个滚动条(我在最顶端的vbox上设置了
overflow:auto
,这样东西在没有滚动条的情况下就不会被切断)

基本上,我想要的是将
标记的内容包装起来,这样对话框就不会比用户的屏幕长,然后将对话框水平调整大小,这样就没有滚动条了

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
<prefwindow xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml" style="width: 100%; height: 100%;" sizemode="maximized">
    <prefpane>
        <script type="application/x-javascript"><![CDATA[
        window.addEventListener("DOMContentLoaded", function (event) {
            // Initialize size
            document.documentElement.style.maxWidth = ((screen.availWidth || screen.width) - 100) + "px";
            document.documentElement.style.maxHeight = ((screen.availHeight || screen.height) - 100) + "px";
        }, false);

        function showExample(n) {
            // Not important...
        }
        ]]></script>
        <preferences><!-- ... --></preferences>
        <!-- Just trying everything with this vbox here... -->
        <vbox flex="1" style="overflow: auto; width: 100%; height: 100%;">
            <groupbox>
                <caption label="Inline Reference Links" />
                <description style="word-wrap: break-word;">Inline reference links are the tiny "superscript" numbers that appear inside [special name here] and link to a reference at the bottom. <button oncommand="showExample(1)" label="Show Example" style="vertical-align: middle;" /></description>
                <radiogroup preference="pref_mode">
                    <radio value="0" label="Show all inline reference links by default" />
                    <radio value="1" label="Hide all inline reference links by default" />
                    <radio value="2" label="Only show inline reference links when hovering over containing paragraph" />
                </radiogroup>
                <hbox>
                    <checkbox preference="pref_hideOtherTags" label="Hide other bracketed tags" />
                    <button oncommand="showExample(2)" label="Show Example" style="vertical-align: middle;" />
                </hbox>
                <checkbox preference="pref_useVisibility" label="Make inline reference links invisible instead of removing them*" />
                <description style="word-wrap: break-word; height: auto;">*When the inline reference links are invisible, they cannot be seen, but they still take up space on the page. When we are set to show inline reference links when hovering over the containing paragraph, this option can be useful to prevent shifting when the reference links are shown.</description>
            </groupbox>
        </vbox>
    </prefpane>
</prefwindow>

内联引用链接是出现在[此处的特殊名称]内的微小“上标”数字,并链接到底部的引用。
*如果内联引用链接不可见,则无法看到它们,但它们仍会占用页面空间。如果将鼠标悬停在包含段落的上方时设置为显示内联引用链接,则此选项可用于防止在显示引用链接时发生移动。

以下是prefwindow的屏幕截图:

当涉及溢出时,大小约束不会正确传播。不幸的是,prefwindow和prefpane元素都包含溢出,因此描述将始终声明一行的高度,直到稍后才会发现它需要更高的高度

一种可能的解决方法可能是删除vbox上的溢出,然后将vbox的高度显式设置为其内容高度。您需要在设置最大宽度后执行此操作,以便第一次调用sizeToContent将获得正确的宽度;第二次调用将获得正确的高度

sizeToContent();
var vbox = document.getElementById('vbox');
vbox.height = vbox.boxObject.height;
sizeToContent();



非常感谢-这正是我要找的!尽管它非常有用,但很难找到
<vbox id="vbox" flex="1">