CSS问题 - 水平滚动条隐藏内容 [英] CSS problem - horizontal scrollbar hides the content
本文介绍了CSS问题 - 水平滚动条隐藏内容的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个问题，因为它给我的滚动条，但高度保持不变，所以文本被滚动条覆盖...
I have a problem with this one... because it gives me the scrollbar but the height remains the same so the text is covered by the scroll bar...
<td class='messages'><div style='border:0px;padding:0px;width:100%;overflow-x:auto;background-color:#66C2FF;height:' class='messages'>
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
</div>
</td>
提前感谢！
推荐答案
将css移动到外部样式表，并使用条件注释仅定位您遇到问题的浏览器（我使用低于或等于IE7，因为我不能复制在IE8）。我已在底部添加了填充。
Move your css to an external style sheet and use a conditional comment to target just the browsers you are having a problem with (I have used lower than or equal to IE7 as I cannot replicate in IE8). I have added padding to the bottom.
实例： http://jsfiddle.net/tw16/Vx9HZ/
将条件注释放在< head> 像这样：
Put the conditional comment in the <head> like this:
<head>
<!--[if lte IE 7]>
<style>div.messages {padding:0 0 22px;}</style>
<![endif]-->
</head>
CSS：已移至外部样式表。
div.messages {
border:0px;
padding:0 0 0;
width:100%;
overflow-x:auto;
background-color:#66C2FF;
}
HTML： >
HTML: Stripped out styling.
<td class='messages'>
<div class='messages'>AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
</div>
</td>
这篇关于CSS问题 - 水平滚动条隐藏内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
