html - 奇怪的引导按钮行为

标签 html css button bootstrap-4

  <a class="btn btn-dark" href="#" role="button">Apple Music</a>

全分辨率工作正常

full resolution image

在特定的分辨率下,bootstrap 的行为是这样的

weird in small resolution image

在智能手机中分辨率再次起作用`

Smartphone resolution

最佳答案

此行为通常与 white-space: normalword-break: break-all 的组合有关。我很确定您的按钮具有 word-break 定义。您可以在代码中检查这一点。

覆盖它的最简单方法是将 white-space 定义更改为 white-space: nowrap 但这也取决于您希望通过按钮文字。如果您希望它继续中断,但只完成单词,您可以删除 word-break 定义或将其覆盖为 word-break: inherit

关于html - 奇怪的引导按钮行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59805124/

相关文章:

jquery - 无法更改两个 css 元素的值

javascript - 仅在移动设备上全屏覆盖导航

html - 一旦我链接列表元素,菜单就会在 Wordpress 模板中分崩离析

jquery - 将文本换行到未设置的图像宽度

html - DIV 高度设置为屏幕的百分比?

android - 如何以编程方式将按钮逐行添加到布局中?

javascript - 具有固定位置的 Bootstrap 面板组 Accordion

css - 为残疾人实现网站版本

flutter 轮廓按钮 : set disabled color

c# - 如何在 C# 中向 winforms 程序添加功能?