gwt - 小部件宽度：50% + 50% > 100%？

Question

我正在使用基于GWT小部件的Google Apps Script和Apps Script UI Builder。

如果我创建一个Flow Panel并添加两个50% 宽度的标签，那么这些标签会出现在不同的行上。但不是 50% + 50% = 100%。

如何让它们出现在同一行？

自己尝试一下：

当然，这个问题不仅仅适用于标签问题。一般来说，我对如何使用UI Builder构建流畅的布局感到非常困惑。似乎有（隐藏的？）填充和边距使事情变得非常困难。

score 2 · Accepted Answer

这一切都基于 CSS 及其盒子模型，并且在过去 15 年左右的时间里，这个问题已经积累了很多。本质上，您指定的宽度不考虑边距（和/或可能的填充，已经有一段时间了），因此您需要添加一个样式表来最小化它们。看到类似这样的CSS 重置。

score 0 · Accepted Answer

Labels 转换为<div>s，默认情况下出现在不同的行上。您可以尝试添加float: left标签，或更改显示模式等。

您也可以尝试InlineLabels，我认为它可以编译为<span>s。

如果您已经尝试过所有这些，那么您Label的 s 显然太宽了。两个 50% 的对象不能放在同一行上很烦人，但是使用 HTML 和 CSS 有什么不烦人的呢？

score 0 · Accepted Answer

解决方案很简单。对于两个标签，设置为零：

边框和边距 / 边距

不知道为什么我昨天没看到 - 我正在值夜班...... ;-)

3 回答 3