gpt4 book ai didi

html - 包含 span 的 div 周围的 CSS 边框,同时完美适合内容

转载 作者:搜寻专家 更新时间:2023-10-31 08:22:42 24 4
gpt4 key购买 nike

<分区>

我试图让 div 以这种方式包装 span 元素:

----------
|Sentence|
----------

-----------------
|It's a looooong|
|sentence |
-----------------

它适用于短句但不适用于长句,因为最终结果如下:

----------------------
|It's a loooong |
|sentence |
----------------------

代码如下:

.div-with-border {
display: inline-block;
border: 1px solid red;
}
.div-with-border span {
display: block;
}

table{
width: 100px;
font-size: 16px;
}
<table>
<tr>
<th width="50%"></th>
</tr>
<tr>
<td>
<div class="div-with-border">
<span>Sentence</span>
</div>
</td>
</tr>
<tr>
<td>
<div class="div-with-border">
<span>It's a loooooong sentence</span>
</div>
</td>
</tr>
</table>

我主要是想删除单词中断和 div 边缘的右边界之间存在的空白,如上例所示。

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