自定义 Dialogflow Messenger 集成的聊天小部件的高度

Question

我正在使用 Dialogflow 的新网站集成“Dialogflow Messenger”。一切工作正常，但当我单击聊天小部件时，聊天窗口的高度超过了浏览器窗口的大小，如所附快照中所示。

我已经阅读了这个聊天小部件的 CSS 定制的官方文档，但我找不到任何有用的方法来处理这个问题。我尝试过不同的浏览器，如 firefox、chrome、safari 等，但问题仍然存在。该文档仅提供了以下 CSS 变量，这些变量没有太大帮助。

如果有人能提供解决方案，我会鼓励。谢谢

Answer 1

您可以尝试使用 CSS 调整小部件聊天显示的容器的高度

使用 CSS，您可以定义HTML 元素的高度、最大高度和最小高度，例如：

df-messenger {
    height: 300px;
    max-height: 90%;
    min-height: 30%;
}

另外，请嵌入元标记以允许responsivenes：

<meta name="viewport" content="width-device-width, initial-scale=1">