Question

当屏幕尺寸变小时，我希望按钮不改变其宽度尺寸。我应该怎么做才能保持 Add admin 按钮的形状不变？

按钮的形状是这样的： My buttons

我希望形状保持这样： Desired result

这是我的 CSS 代码：

.button {
    background-color: black;
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    padding: 10px 25px;

Answer 1

您根本不需要加宽按钮只需控制文本，使其在不同设备上不会断线

.button { 
    ...
    white-space  : nowrap;
    overflow     : hidden;
    text-overflow: ellipsis
}

Answer 2

添加white-space: nowrap;

.button {
    background-color: black;
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    padding: 10px 25px;
    white-space: nowrap;
}

Answer 3

{

min-width: (desired value) px!important;
max-width: (desired value) px!important;
}

放置一个静态值应该可以工作:) 如果您希望在所有设备中都使用相同的值 :)

当屏幕尺寸变小时如何使按钮不调整宽度？

3 个答案: