为什么背景不显示？ （CSS问题）
我有以下 Xul:
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="chrome://bartest/skin/bartest.css" type="text/css"?>
<window width="400" height="300"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<vbox id="backBox">
<hbox id="frontBox">
<!-- this label is needed, else this box doesn't show up -->
<label value="" />
</hbox>
</vbox>
</window>
和以下 CSS：
#backBox {
background-color: red;
width: 200px;
position: fixed;
left: 0;
}
#frontBox {
background-color: blue;
width: 100px;
position: fixed;
left: 0;
}
我期望看到一个 200px 的红色框，里面有一个 100px 的蓝色框。但我看到的只是 100px 的蓝色框。
为什么红色框（id =“backBox”）没有显示？
I have the following Xul:
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="chrome://bartest/skin/bartest.css" type="text/css"?>
<window width="400" height="300"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<vbox id="backBox">
<hbox id="frontBox">
<!-- this label is needed, else this box doesn't show up -->
<label value="" />
</hbox>
</vbox>
</window>
with the following CSS:
#backBox {
background-color: red;
width: 200px;
position: fixed;
left: 0;
}
#frontBox {
background-color: blue;
width: 100px;
position: fixed;
left: 0;
}
I expected to see a 200px red box, and a 100px blue box inside. But what I'm seeing is just the 100px blue box.
Why the red box (id="backBox") is not showing up?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
这里应该发生的是，两个盒子都应该拉伸到窗口的宽度，因为你没有告诉它们不要这样做，并且容器默认拉伸它们的子项。如果你希望它们的盒子尊重它们的CSS宽度，那么你需要更改它们的对齐方式，这可以通过align =“start”属性或CSS -moz-box-align：start来实现；但请注意，它们属于父级，即窗口和垂直盒子。
What should happen here is that both the boxes should be stretched to the width of the window, because you haven't told them not to, and containers stretch their children by default. If you want their boxes to respect their CSS width then you need to change their alignment which is achieved either by the align="start" attribute or CSS -moz-box-align: start; but note that these belong on the parents i.e. the window and the vbox.