Html 底部几个像素的文字被切断

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7760193/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 11:06:54  来源:igfitidea点击:

Bottom few pixels of text cut off

htmlcss

提问by Reece

I really can't figure out what's going on in this case. On the multiline pieces of text, the bottom few pixels are cut off.

我真的无法弄清楚在这种情况下发生了什么。在多行文本上,底部的几个像素被切除。

采纳答案by Jason Gennaro

The quickest fix looks to be this:

最快的修复看起来是这样的:

Change the font-sizehere from 14pxto 13px

font-size此处从更改14px13px

#slidertext h3 {
font-size: 13px;
// other styles
}

Works for me in Chrome.

在 Chrome 中为我工作。

回答by C.M.

Setting

环境

line-height: normal;

Worked for me.

为我工作。

回答by Tushar Shukla

Changing font-sizeand font-familyis just a workaround. I had same issue. It works well in Firefox however not in Chrome. Check paddingor marginof the input box. It was paddingin my case. I changed padding:6pxto padding:0px 6px;in my case.

改变font-sizefont-family只是一种解决方法。我有同样的问题。它在 Firefox 中运行良好,但不适用于 Chrome。检查输入框的paddingmargin。就padding我而言。我改变了padding:6pxpadding:0px 6px;我的情况。

回答by Doozer Blake

On #slidertext liyou have overflow: hidden;set. You either need to adjust height of the li, you have inline styles setting it to height: 32px, turn off overflow, or adjust the font size inside of there.

#slidertext li你已经overflow: hidden;设置。您需要调整 li 的高度,您可以将内联样式设置为height: 32px,关闭溢出,或者调整里面的字体大小。

回答by tradesouthwest

As per specific Browsers this kind of issue is related to the Font Family, very often. My solution for text being cut off is to change the font family to sans-serifand see if this has any effect. This worked infallibly on any browser I tried it in.

根据特定的浏览器,这种问题经常与字体系列有关。我的文本被截断的解决方案是将字体系列更改为sans-serif,看看这是否有任何影响。这在我尝试过的任何浏览器上都非常有效。

As from what the other threads above are stating... it just might help to adjust line-height and padding, sometimes, but for me, none of these worked in general:

正如上面其他线程所说的那样......它有时可能有助于调整行高和填充,但对我来说,这些一般都不起作用:

max-width: 100%;
min-height: 1.62em;
padding: 2px 5px 2px 5px;    
vertical-align: initial;

font-family: initial, sans-serif, serif;is a good starting point and then you can find a font that plays nice with your theme/site.

font-family: initial, sans-serif, serif;是一个很好的起点,然后您可以找到适合您的主题/网站的字体。

回答by MIA

This fix mine:

这个修复我的:

letter-spacing: normal;

回答by Niche

Check the size of the sliderwrap, the height attribute may be in conflict with the total text size, and since your overflow is hidden, according to your css property, that might be your issue.

检查滑块的大小,高度属性可能与总文本大小冲突,并且由于您的溢出被隐藏,根据您的 css 属性,这可能是您的问题。

Perhaps fixing it like this:

也许像这样修复它:

#sliderwrap
{
    height:114;
}