Question

我想根据<span id="dykSelectedReadMore">的文字大小改变div元素的大小。

<div class="flipper-back">

<a href="#" class="js-flipper-flip flipper-close"></a>
<div class="pad-box">
    <h3 class="colored">Did you know</h3>
    <div class="pad-30-0-0">
        <b><span id="dykSelectedIssue">som text</span></b>
        <br><br>
        <span id="dykSelectedReadMore">...e-identities by 2025.  Estonia introduced e-residency in 2014. Non-residents can get ID certificates with the functionality of Estonian ID card. This allows them to start using Estonian digital services from anywhere on Earth. E-residency is attracting entrepreneurs needing an investment account in the European Union, and is bringing more customers to Estonian companies and more capital into the country's economy.</span>
    </div>
</div>

Answer 1

我认为你不应该使用Javascript，而是使用CSS。当div包含浮动元素无法计算其正确的高度时（因为不考虑这些元素的高度），就会出现这种问题。

按照最简单，最快捷的方式解决。

开始添加此CSS代码：

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

（来源CSS-Tricks）

将该类应用于flipper-back div或pad-box。取决于女巫<div>包含浮动元素。

例如。 <div class="flipper-back clearfix">

消息框大小应取决于jQuery中的消息大小

1 个答案: