嗨,我的网站有问题。出于某种原因,我的文本正在换行。
例如,我有单词Hip Hop
,但它显示为
Hip
Hop
这是html
<div class="medium-2 column first-post-category">
<h1 class="category-first"><?php $cat = get_the_category(); $cat = $cat[0]; echo '<a href="' . get_bloginfo('url') . '/category/' . $cat->category_nicename . '">'; echo $cat->cat_name; echo '</a>'; ?></h1>
</div>
这是css
.first-post-category{
position:absolute;
top:6%;
left:1%;
}
.category-first{
background:#0076c1;
font-family:'Khula', sans-serif;
font-size:30px;
color:#fff;
padding:6px;
}
这里是一个照片示例。
照片一
使用当前代码,它可以很好地呈现,但只要不想将文本分割成另一行,请使用white-space: nowrap
nowrap
像正常情况一样折叠空白,但不在文本中换行(文本换行)。
.first-post-category {
position: absolute;
top: 6%;
left: 1%;
}
.category-first {
background: #0076c1;
font-family: 'Khula', sans-serif;
font-size: 30px;
color: #fff;
padding: 6px;
white-space: nowrap
}
<div class="medium-2 column first-post-category">
<h1 class="category-first">Hip Hop</h1>
</div>