firefox扩展中的元素高度和位置

Question

我正在构建一个扩展程序，我使用此代码显示一个带有进度条的窗口：

 <?xml version="1.0"?>
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window
  id="findfile-window"
  title="Please wait.."
  orient="horizontal"
  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

  <progressmeter value="50" style="height:4px;"/>

</window>

但由于某种原因，身高不会改变，看起来像https://www.dropbox.com/s/8ekej9vlifc2tt6/Capture.PNG

有什么想法吗？

Answer 1

尝试更改

<progressmeter value="50" style="height:4px;"/>

到

<progressmeter value="50" style="max-height:4px;"/>

它看起来像这样：

Answer 2

使用浏览器中的调试工具检查DOM。确认该栏实际上是progessmeter。

从那里，使用调试器验证计算的高度。

如果您知道如何使用浏览器CSS调试器，这应该是一个简单的解决方案。如果您可以将实际代码放在一个小提琴中，我可以提供更多信息。

Answer 3

CSS box-align / XUL::attr align默认为stretch。将其设置为其他内容，在周围的框中 - 您的案例中的窗口元素 - 将解决您的问题。

pack="end"示例：

其他有趣的布局相关的XUL内容，用于按照您的需要布置您的小部件：flex，pack，orient，separator，grid。这些属性通常也有相应的CSS规则。