微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

<vaadin-horizo​​ntal-layout> 是垂直的,不是水平的

如何解决<vaadin-horizo​​ntal-layout> 是垂直的,不是水平的

我有一个关于 Vaadin 组件的问题。我已经使用他们的声明性 API (HTML API) 成功地将它们添加到静态网页中。 (请参阅 https://web-call.cc/ 。)元素 (https://vaadin.com/components/vaadin-ordered-layout/html-examples) 的 HTML API 显示如下用法

<vaadin-horizontal-layout>
  <div>Item 1</div>
  <div>Item 2</div>
</vaadin-horizontal-layout>

但我必须添加样式 display: flex; 以使布局水平。为什么我必须这样做? (我通过在 Chrome 中使用 Dev Tools 查看布局获得了这个想法,它显示了该样式的水平布局。)当我为水平布局和垂直布局添加样式规则时,垂直布局也变成了水平!文档没有显示应用于布局的样式;仅适用于这些布局中包含的项目。我错过了什么吗?

解决方法

布局行为不当的原因是我忘记了这些导入:

import '@vaadin/vaadin-ordered-layout/vaadin-vertical-layout.js'
import '@vaadin/vaadin-ordered-layout/vaadin-horizontal-layout.js'```

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。