如何让锚标签内容不断裂，其中有I标签在里面的内容
但我要的是不破不立。就像这张图片非破损锚标
我的HTML代码。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
</head>
<body>
<a class="show-more-btn" href="javascript:void(0);">Read More <i style="font-size:15px;" class="fa fa-chevron-down" aria-hidden="true"></i></a>
</body>
</html>在这种情况下无法使用。
谁能帮我解决这个问题？
先谢谢你。
使用 white-space: nowrap; (见 MDN上的空白)在你的按钮上。
.show-more-btn i {
font-size: 15px;
}
.box {
border: 1px solid #ddd;
max-width: 85px;
}
.show-more-btn {
white-space: nowrap;
}<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<div class="box">
<a class="show-more-btn" href="javascript:void(0);">Read More <i class="fa fa-chevron-down" aria-hidden="true"></i></a>
</div>