Disappearing Div in Chrome and Safari

Question

I am having a troublesome issue of a disappearing DIV element on a specific panel of a jQuery Tools scrollable.

It is only hiding on the final panel of the slider, check out http://andstones.ca/company/ to see an example, and using either chrome or safari, see the div disappear.

The code calling the div is:

<div style="width: 900px ! important;" class="rule_water"></div>

And it seems to show up for a second, and then hide.

Can't seem to figure our this cross browser issue.

Thanks for the help,

Kory

Answer 1

When I remove the float:left !important from .rule_water it doesn't seem to hide the div anymore

Answer 2

I had the same problem: the div sidebar floating left was hidden by the main content div that had a 200px left margin and inherited the width from the parent div (I used a pre-made theme for a wordpress installation). The sidebar was called after the main content (more SEO-friendly) so I tried calling it first and indeed the sidebar was showing correctly. So, the problem is: the margin of the main content hides the div. You have two way to solve this: 1) you call the hidden div first or 2) you delete the main content margin and give it a precise width AND (most important) you assign it float: right; rule.

Hope this helps.