CODEWITHSUNDEEP
htmlcss
LegendaryLaggy
LegendaryLaggy

Reputation: 455

overflow hidden doesnt seem to work in firefox

I'm having a small problem with my project, I have made a sliding wall with css, it looks ok in chrome but I have no idea why it doesnt work with firefox as it gives me a large overflow to the side.

It looks like its something to do with <div class=info> but it something else might be causing it.

This code is from a tutorial which should work as I have not changed much, I thought that <div id=overflow> which just has this as css

#overflow {
width: 100%;
overflow: hidden;
min-height: 600px; }

would do the job but not in my case.

Here is the link to the jsFiddle to show the problem

Right now I have no idea what is causing the problem, notice the scroll bar at the bottom of the site when using firefox.

How can this problem be fixed?

Upvotes: 0

Views: 293

Answers (3)

jshariar
jshariar

Reputation: 338

This works for me in firefox:

#overflow {
width: 100%;
overflow-x: hidden !important;
position:relative !important;
min-height: 600px; }

Upvotes: 1

AzDesign
AzDesign

Reputation: 1199

Check this out All you have to do is to add position:relative; into your #overflow. This is working in my firefox 20.0.1

Upvotes: 2

Mark Ryan Sallee
Mark Ryan Sallee

Reputation: 293

If you set:

html {
    width: 100%;
    overflow-x: hidden;
}

It seems to correct the issue in Firefox. It does mean that if the browser window is narrower than the content, the user won't be able to scroll to see the hidden content.

Upvotes: 0

Related Questions