它工作谢谢!

我正在考虑更新,但犹豫,我不知道如何解决过渡(浪子yaml的修改)
就我而言我后,我想保留它。

类型:自定义:layout-card布局:垂直column_num: 8 column_width: 100%卡:-类型:自定义:layout-card布局:水平column_width:[12.5%,汽车,12.5%、12.5%]column_num: 4卡:

导致:

我应该使用砖石,水平或玩一个网格布局?

你好大社区:slight_smile:

我今天来找你帮助的问题是阅读可用的文档包括后把我逼疯了www.19463331.comhttps://css-tricks.com/snippets/css/complete-guide-grid/

我的配置如下:

——类型:自定义:layout-card layout_type:网格layout_options: grid-template-columns: grid-template-rows 5% - 95%: 80% - 20%对齐项目:grid-template-areas: |“free1栏”“免费2 lixo”牌:[…]-类型:水平叠加view_layout:栅格:lixo卡片:-类型:“自定义:button-card”实体:传感器。lixo图标:“mdi: trash-can-outline”名称:lixo show_icon:真正的show_name:错误的样式:名片:宽度:60 px -高度:60 px -保证金:10 px - margin-bottom: 1 px - margin-top: 1 px - border - radius: 15 px -边框宽度:1 px -边框样式:固体-边框颜色:var (——primary-background-color) - background: var (——primary-background-color)图标:-颜色:var (——primary-text-color) tap_action:没有——类型:减价活动内容:| #{{州(sensor.lixo)}}风格::| ha-card {——ha-card-background:没有!重要;不必:没有!重要;高度:20 px;margin-top: 1 px;margin-bottom: 1 px;h1 {} ha-markdown: $: |字体大小:15 px;粗细:大胆的;字体类型:Helvetica;字母间距:“-0.01 em”; }

问题是我不能似乎把垃圾桶卡底部的“细胞”:

图像

看来我不能让“对齐项目”工作。

有人使用这个配置吗?

提前谢谢你。

对齐项目不支持,但是相结合对齐项目justify-items是多少。

非常感谢你的快速回复。
我申请了,但似乎并没有任何影响,请确认如果我使用是正确的吗?

——类型:自定义:layout-card layout_type:网格layout_options: grid-template-columns: grid-template-rows 5% - 95%: 80% - 20% #对齐项目:名:结束结束grid-template-areas: |“free1栏”“免费2 lixo”牌:

图像

也不会出现在控制台:
图像

我犯了一个错误当释放2.2.3两天前。
如果你安装了2.2.3,尝试删除并重新安装。

即使它似乎工作吗?
(我在这里2.2.3,似乎好)

神奇的!
它的工作原理!

非常感谢你再一次,感谢你做的一切你的社区。

确认屏幕截图:stuck_out_tongue:

图像

这工作对我来说:

类型:自定义:layout-card layout_type:自定义:网格布局布局:grid-template-columns: 70% 1 fr grid-template-rows: 1 fr

编辑:不工作在手机应用程序

嗨,伙计们,

我有一个新问题,我不确定它有了这张卡,apex-charts或mod-card。所以,提前道歉,如果这是错误的论坛。
让我解释一下:slight_smile:

当我使用view_layout apex-charts我得到这个错误:


这段代码:

——类型:自定义:layout-card layout_type:网格布局:grid-template-columns: 1 fr 1 fr 1 fr 1 fr 1 fr 1 fr grid-template-rows: fr 1 fr # grid-template-areas: sidebarleft | #”。“#”sidebarright sidebarleft主要sidebarright sidebarleft“#”。sidebarright”牌:类型:“自定义:apexcharts-card view_layout: #网格:中心grid-column: 1 / 4行:1/1 apex_config:

当我使用一个自定义:mod-card我得到这个警告:
图像
这段代码:

——类型:自定义:layout-card layout_type:网格布局:grid-template-columns: 1 fr 1 fr 1 fr 1 fr 1 fr 1 fr grid-template-rows: fr 1 fr # grid-template-areas: sidebarleft | #”。“#”sidebarright sidebarleft主要sidebarright sidebarleft“#”。sidebarright”牌:类型:自定义:mod-card view_layout: #网格:中心grid-column: 1 / 4行:1/1名片:类型:“自定义:apexcharts-card”apex_config:传说:显示:假的

我想说这是apexchart卡有点太挑剔的配置…

解决很好的尝试,但我建议使用堆栈卡代替mod-card。

@RomRiderhttps://github.com/home-assistant/frontend/blob/c269c8fd3fa9f765b1926e0f7055342690595d2d/src/data/lovelace.ts L109
(和https://github.com/home-assistant/frontend/pull/8714)

2喜欢

是的:slight_smile:
摆脱了这种方法的错误和警告:slight_smile:

再次非常感谢你!

是的,我需要更新。
然而,与此同时,有一个选项在config-check apexcharts禁用眨眼:

看到在这里

类型:自定义:apexcharts-card实验:disable_config_validation:真的
2喜欢

找不到是什么导致这种额外的填充在一行2.2.3 layout-card顶部。与网格垂直叠加,图像元素,下面stack-in-card部分对齐。

类型:自定义:layout-card layout_type:自定义:网格布局布局:grid-template-columns: 33% 1 fr

这是奇怪的。
试着看看你的浏览器对象检查员。也许你可以找到有什么差距。

简化,我剥下来2实体在一个空标签但我的运气是软弱,我不知道足以看到一个问题。甚至无法弄清楚如何剪切和粘贴,但这里是:

你怎么能证明在水平布局左边的屏幕吗?

这张卡是好的。使它更容易为我现有的仪表板转化为单一垂直列给我移动仪表板而不是编辑的原始配置添加垂直叠加卡。也更容易编辑堆栈中的卡片相比,移动仪表板与垂直叠加卡我已经我已经转换为layout-card用一个垂直列。

你好,
不幸的是我使用布局卡以不同的方式在许多不同的观点。现在我要做的工作有很多的更新。主要是我让它工作,但一些特殊的分我困惑,我需要进一步测试。但一个简单的东西我不知道什么是错。我希望你能帮助我“主要allignment”:

完整的allignment layout-card走了,我不知道如何中心。如果我设置面板假不集中(“面板:错误的”有点的中心)。
这是截图和代码的相关部分(我删除风格、元素和card-content更好的可读性):

编辑:我现在改为垂直布局(在这种情况下似乎工作好,但我想我会得到相同的allignment问题与其他卡,无疑,我需要网格布局。所以我仍然需要你的帮助)

标题:vacuum_new面板:真正的背景:中心/封面没有重演url(/地方/背景/ white_03.jpg)固定图标:mdi:遥控吸尘器卡片:-类型:自定义:layout-card layout_type:网格布局布局:grid-template-columns: 510 px 495 px grid-template-rows: 119 px 98 px汽车汽车汽车卡:# # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # -类型:图像元素view_layout: grid-column: 1 / 2行:1 / 2风格:| #删除图片:/地方/ roborock / logo_background_07。png元素:#删除# # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # -类型:图像元素view_layout: grid-column: 1 / 2行:2 / 4风格:| #删除图片:/地方/ roborock / vacuum_plan_09。png元素:#删除# # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # -类型:图像元素view_layout: grid-column: 1 / 2行:4/5风格:| #删除图片:/地方/ roborock / Roborock_view_15。png元素:#删除# # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # -类型:图像元素view_layout: grid-column: 2 / 3行:1 / 3风格:| #删除图片:/地方/ roborock / remote_background_06。png元素:#删除# # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # -类型:水平叠加view_layout: grid-column: 2 / 3行:3/6卡:#删除
3喜欢

你好,这是有可能的布局在一个色鬼卡吗?