html - html - “宽度:100%”页面中的文本溢出
问题描述
我有一个链接溢出页面的页面。我希望他们能留在下面的线上。
我放了以下几行:
display:inline-block; overflow: auto;
但没有用。
.hashtag {
font-family: 'Titillium Web', sans-serif;
padding: 28px;
font-size: 30px;
width: auto;
text-align: center;
text-decoration: none;
margin: 5px 2px;
background-color: rgb(98,124,169,0.8);
color: white;
display: inline-block;
line-height: 1;
<a style="background-color: rgb(98,124,169,0.8); color: white; cursor: pointer;line-height: 1;" class="hashtag" id="load2">TODAY</a> <a style="background-color: rgb(98,124,169,0.8); color: white; cursor: pointer;overflow: auto;" class="hashtag" id="load3">LIVE</a> <a href="player-hd/podcasts.html" style="background-color: rgb(98,124,169,0.8); color: white; cursor: pointer;line-height: 1;overflow: auto;" class="hashtag">PODCASTS</a>
(对不起我的英语)提前谢谢。
解决方案
您需要添加vertical-align:middle;
to.hashtag
以阻止第一个元素被下拉。您还可以添加white-space: nowrap;
到父center
元素以停止元素包装。
center {
white-space: nowrap;
}
.hashtag {
font-family: 'Titillium Web', sans-serif;
padding: 28px;
font-size: 30px;
width: auto;
text-align: center;
text-decoration: none;
margin: 5px 2px;
background-color: rgb(98,124,169,0.8);
color: white;
display: inline-block;
line-height: 1;
vertical-align:middle;
}
<center><a style="background-color: rgb(98,124,169,0.8); color: white; cursor: pointer;line-height: 1;" class="hashtag" id="load2">TODAY</a> <a style="background-color: rgb(98,124,169,0.8); color: white; cursor: pointer;overflow: auto;" class="hashtag" id="load3">LIVE</a> <a href="player-hd/podcasts.html" style="background-color: rgb(98,124,169,0.8); color: white; cursor: pointer;line-height: 1;overflow: auto;" class="hashtag">PODCASTS</a></span>
推荐阅读
- python - 根据等式对两个数据帧中的行求和
- shopify - 添加消息提醒“选择您的尺码” 添加到购物车之前 shopify
- neural-network - Pytorch中特定层参数的梯度
- python - 在 matplotlib 中悬停时显示 x 轴的值
- github-pages - NuxtJS 和 Github 用户页面
- vba - 在 VBA 中尝试在多个工作表中创建具有多个条件的动态 Sumifs 公式
- vue.js - 在 vue 2 应用程序中使用 vee-validate 2 和 composition-api
- html - 如何使我的 img:hover 代码与两个不同的代码一起使用?
- json - 使用 ajax 更新 Chart.js 数据
- python - 如何根据python和sqlalchemy中的表数据和关系动态过滤结果?