删除CSS中的水平滚动条

时间:2021-02-16 20:35:17

I am using a facebook like button on my web page. I need it to align at the right side of the page. But there is a horizontal scroll bar displaying.

我在我的网页上使用类似Facebook的按钮。我需要它在页面的右侧对齐。但是有一个水平滚动条显示。

Please see the fiddle http://jsfiddle.net/u4kMs/

请看小提琴http://jsfiddle.net/u4kMs/

I couldn't find out what causes this. How to fix this?

我无法找出导致这种情况的原因。如何解决这个问题?

4 个解决方案

#1


8  

The scrollbar appears because the content is too wide for your screen.

出现滚动条是因为内容对于您的屏幕而言太宽。

Just omit the width on the div element, it will auto-expand to 100% of it's parent. Floating the facebook button to the right like you already did should then align the button correctly without scrollbar.

只要省略div元素的宽度,它就会自动扩展到它的父元素的100%。像往常一样将Facebook按钮浮动到右侧,然后应该正确对齐按钮而不使用滚动条。

If you don't get a satisfying solution you can still declare overflow:hidden on the containing div to supress the scrollbars.

如果你没有得到令人满意的解决方案,你仍然可以声明溢出:隐藏在包含div上以压缩滚动条。

This would be the result: http://jsfiddle.net/poikl/u4kMs/8/

这将是结果:http://jsfiddle.net/poikl/u4kMs/8/

#2


25  

to disable scroll, try something like;

禁用滚动,尝试类似的东西;

.your_div_class{
    overflow-x: hidden;
    overflow-y: scroll;
}

#3


0  

It's because the frame is too small for the width that you have set on the top div

这是因为框架对于您在顶部div上设置的宽度来说太小了

<div style="margin-left:auto; margin-right:auto; width:980px;">

So when this is on your web page yo shouldn't get the horizontal scroller. If you do, then consider changing the above width

所以,当你的网页上有这个时,你不应该得到水平滚动条。如果这样做,请考虑更改上述宽度

#4


0  

Try this and remember to put the "right-aligned" div before the left-aligned div, even the right div have to be "after" graphically speaking.

试试这个并记住在左对齐的div之前放置“右对齐”div,即使是正确的div也必须在图形之后“之后”。

#1


8  

The scrollbar appears because the content is too wide for your screen.

出现滚动条是因为内容对于您的屏幕而言太宽。

Just omit the width on the div element, it will auto-expand to 100% of it's parent. Floating the facebook button to the right like you already did should then align the button correctly without scrollbar.

只要省略div元素的宽度,它就会自动扩展到它的父元素的100%。像往常一样将Facebook按钮浮动到右侧,然后应该正确对齐按钮而不使用滚动条。

If you don't get a satisfying solution you can still declare overflow:hidden on the containing div to supress the scrollbars.

如果你没有得到令人满意的解决方案,你仍然可以声明溢出:隐藏在包含div上以压缩滚动条。

This would be the result: http://jsfiddle.net/poikl/u4kMs/8/

这将是结果:http://jsfiddle.net/poikl/u4kMs/8/

#2


25  

to disable scroll, try something like;

禁用滚动,尝试类似的东西;

.your_div_class{
    overflow-x: hidden;
    overflow-y: scroll;
}

#3


0  

It's because the frame is too small for the width that you have set on the top div

这是因为框架对于您在顶部div上设置的宽度来说太小了

<div style="margin-left:auto; margin-right:auto; width:980px;">

So when this is on your web page yo shouldn't get the horizontal scroller. If you do, then consider changing the above width

所以,当你的网页上有这个时,你不应该得到水平滚动条。如果这样做,请考虑更改上述宽度

#4


0  

Try this and remember to put the "right-aligned" div before the left-aligned div, even the right div have to be "after" graphically speaking.

试试这个并记住在左对齐的div之前放置“右对齐”div,即使是正确的div也必须在图形之后“之后”。