css - 在 xul 扩展中定义图像的高度

Question

我的扩展是一个叠加层，在工具栏内有一些图像。我需要将这些图像显示得很小(大约 15 像素)，但它们始终呈现在工具栏的相同高度。我已经尝试定义图像的高度和 maxHeight 以及放置它们的 hbox 但它不起作用。

这是一段代码:

...

<toolbox id="navigator-toolbox">
    <toolbar id="my-toolbar">
        <label>images:</label>
        <hbox id="rsour_inputRating">
            <image id="rsour_1" />
            <image id="rsour_2" />
            <image id="rsour_3" />
            <image id="rsour_4" />
            <image id="rsour_5" />
        </hbox>
    <toolbarseparator />

...

Answer 1

正确的做法是在CSS中使用-moz-box-align，或者在xul中使用align属性，这样图片就不会垂直拉伸(stretch)了:

#rsour_inputRating{
  -moz-box-align:center;
}

#rsour_inputRating img{
  list-style-image : url("chrome://...");
  width:20px;
  height:15px;
}