如何使文字适合Plotly Web应用程序中的按钮宽度？

问题描述

我正在制作一个带有破折号的Web应用程序。当然，有一个回调，然后是def，最后将结果输出给子代。

回调如下，

@app.callback(
    Output('prediction-content','children'),[Input('input','value')]

def的输出是一条长消息，带有模型预测，如下所示：

def predict(input):

    function(input)
    results = f'xxxxxx ${pred:,.0f} xxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxx'

    return results

孩子们在这个Div

html.Div([
                html.Button(id='prediction-content'),]),

现在我的问题是，当我缩小浏览器时，按钮是响应式的（因为CSS的宽度是100％），但是按钮上的文本却没有。

那么如何包装文本使其适合按钮？就像句子的其余部分转到下一行一样，而不是被切得太尖锐？

谢谢！

顺便说一句，我在Google上搜索了很多，却找不到解决方案。找到了类似的帖子， Make button width fit to the text，但似乎不起作用。

解决方法

我终于修复了它，在自定义CSS中，我添加了：

Height: 100%;
white-space: normal

现在，显示溢出的文本。