子コンポーネントの幅が親を超えています

Question

CssLayoutに基づいたビューがあります。このビューは最小幅があらかじめ定義されていますが、画面全体を拡大することができます。このビューは、親と呼ばれ、リストビュー内に子ビューを持ちます。各子は、Horizo​​ntalLayoutを継承する同じクラスのインスタンスです。

レイアウトにいくつか問題があります。

最初に、子供は高さに基づいて適切に配置するのではなく、各子供にスペースのパーセンテージを与えるVerticalLayoutのカプセル化のために、互いに重なり合っています。 VerticalLayoutは、リストが親より大きい場合に親をスクロールする必要があるために必要です。

第2に、子供は親に合うようにサイジング幅がありません。私の試みは、横のスクロールが必要であるか、または子が親よりも幅が狭く、余分なスペースを持つように、子が大きくなるように修正しようとします。画像に見られるように

、上位2人の子供が右に余分なスペースを許可しています。 3番目の子が親の幅をあふれているため、水平スクロールが発生します。

VaadinまたはCSSを使用してこれら2つの問題を解決するにはどうすればよいですか？

Answer 1

さらにテストを行った結果、リストの子とリストの親を切り替えてCssLayoutを使用し、そのコンテンツを埋め込んだ後に高さまたは幅を設定することで、希望の影響に近づくことができました。