向右浮动使文本看起来更小[关闭]答案

【问题标题】：float right making text looks smaller [closed]向右浮动使文本看起来更小[关闭]
【发布时间】：2019-08-01 19:31:58
【问题描述】：

我有这个 html ：

.CONNECT-WITH-US {
        font-family: "Open Sans";
        font-size: 8px;
        font-weight: 600;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #141b2f;
        padding: 5px 24px 0 24px;
    }
    
    .connect {
        float: right;
    }

<div class="CONNECT-WITH-US"><label>CONNECT WITH US</label><label class="connect">CONNECT WITH US</label></div>

此代码在小屏幕（移动设备）中看起来像这样 div 中的第二个标签文本变小。是因为浮动吗？

【问题讨论】：

考虑发布您的代码并正确描述您的问题。见stackoverflow.com/help/how-to-ask。是不是 font-size : 8px 导致了您的问题？
你能解释一下是什么变小了
不，这是整个 div 的大小（两个标签）

标签： html css css-float

【解决方案1】：

我在代码中做了一些编辑

适用于移动屏幕。可能我没听懂你想问什么……

.CONNECT-WITH-US {
    font-family: "Open Sans";
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #141b2f;
    padding: 5px 24px 0 24px;
}



.CONNECT-WITH-US .label-2 {
    float: right;
}

<div class="CONNECT-WITH-US">
<label>CONNECT WITH US</label>
<label class="label-2">CONNECT WITH US</label>
</div>

【讨论】：

字体大小适用于两个标签，这就是我在 div 上添加样式的原因。问题是第一个标签的大小为 8px，但第二个标签看起来更小。
这个 CSS 有很多错误。这是如何被接受的答案？还有两个赞成票？
@Turnip 正确，甚至不需要那么多 CSS

【解决方案2】：

.CONNECT-WITH-US {
        font-family: "Open Sans";
        font-weight: 600;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #141b2f;
        padding: 5px 24px 0 24px;
    }
    
    .connect {
        float: right;
    }

<div class="CONNECT-WITH-US"><label>CONNECT WITH US</label><label class="connect">CONNECT WITH US</label></div>

由于某种原因，font-size 似乎会使屏幕上的一段文字变小。即使在 sn-p 中，事情也能正常工作。似乎如果您在打电话，那么float: right 播放效果不佳，并且使一段文本成为原始<p> 大小，另一段是您声明的8 pixels。如果你真的致力于让它在手机上保持这种尺寸，你可以尝试某种@media CSS 来使样式在较小的屏幕上有所不同。

【讨论】：