gpt4 book ai didi

html - CSS 在一行而不是两行中获取文本

转载 作者:技术小花猫 更新时间:2023-10-29 11:42:12 26 4
gpt4 key购买 nike

我有一个标题的小问题,我希望文本显示在一行上而不是分成两行,因为我试图将这些 block 排列成网格

jsFiddle

html

<div class="garage-row">
<a class="garage-row-title" href="/board/garage_vehicle.php?mode=view_vehicle&amp;VID=4">
<div class="garage-title">1996 Land Rover Defender</div>
<div class="garage-image"><img src="http://enthst.com/board/garage/upload/garage_vehicle-4-1373916262.jpg"></div>
</a>
<div class="user-meta">
<b>
<a href="{block_1.row.U_COLUMN_2}">Hobbs92</a>
</b>
</div>
</div>

CSS

@import url(http://fonts.googleapis.com/css?family=Open+Sans);


.garage-row {
border: 1px solid #FFFFFF;
float: left;
margin-right: 5px;
padding: 12px;
position: relative;
width: 204px;
}
.garage-row img{}
.garage-image {
background-position: center center;
display: block;
float: left;
max-height: 150px;
max-width: 204px;
overflow: hidden;
position: relative;
}

.user-meta {
background: none repeat scroll 0 0 #2C3539;
color: #FFFFFF;
float: left;
padding: 10px;
position: relative;
width: 184px;
}
img {
border-width: 0;
height: auto;
max-width: 100%;
vertical-align: middle;
}
.garage-title {
clear: both;
display: inline-block;
overflow: hidden;
}
.garage-row-title {
font-size: 22px;
font-weight: bold;
}
a:link {
color: #43A6DF;
}
font-family: 'Open Sans',sans-serif;

如果有人能帮我把标题变成一行而不是两行,或者甚至修复它,如果标题超过宽度就会变成省略号,我将不胜感激。

最佳答案

添加white-space: nowrap; :

.garage-title {
clear: both;
display: inline-block;
overflow: hidden;
white-space: nowrap;
}

jsFiddle

关于html - CSS 在一行而不是两行中获取文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17704539/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com