CSS中的文本重叠

-2

只是一个简单的问题 - 我在搜索时找不到这个问题，但如果是重复，我很抱歉。CSS中的文本重叠

我有段落标记包围我的网站的标题：

<div class = "title"> 
    <p>Welcome to homepage!</p> 
</div> 

<div class = "subtext"> 
    <p> Subtext goes here </p> 
</div> 

<div class = "formthing"> 
    <form method = "GET" action = "/form"> 
    <input type = "submit" name = "submitted" class = "btn-large" value = "Click button" /> 
    </form> 
</div>

和一切工作正常。但是，当我放大页面时，标题的文字重叠。有什么我可以添加到CSS来防止这种情况发生？

来源

2013-12-08 HJ32

请添加比这更多的信息。没有人能帮助没有任何事情可以解决。 – Josiah

当没有提供代码时，您如何期待别人来帮助您。 rovide小提琴 – San

@San增加了代码。 – HJ32

我没有看到你的代码有任何重叠，但一个快速解决的办法是可以通过CSS为你的类添加边距以防止重叠。

如：

<style> 
.formthing { 
margin: 0.25em; 
} 
</style>

来源

2013-12-08 02:58:54 user3037493

您需要使用em字体大小在CSS。如果你不知道这是什么，这是它一个很好的文章：http://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/

本质em被表达的百分比只是另一种方式，但使用pt，px在一些浏览器在上级与下级放大的动摇和%值。使用em可以最好地缓解此问题。

font-size: 16px; 
font-size: 100%; 
font-size: 1em;

大多数现代浏览器将默认为16px的字体大小作为控制和调节关闭的，在作出上述3字体大小彼此相等（给予或采取在Firefox和IE一些小数）。这不是简单的，但大多数情况下都能帮助你解决这些问题。这是一种非常广泛实践和验证的防止意外文本和元素重叠的方法。

此外 - 可能想看看你正在使用的字体，是否有任何字距应用，也许利用letter-spacing: 1px;并作出相应调整。

不要忘记使用CSS重置像Normalize.css。

来源

2013-12-08 03:11:00 Deryck

CSS中的文本重叠

回答

相关问题