Spry Accordion by DW works in IE but doesn't work in FF please help

[kamila3194]

Hi, I am a beginer in designing webs, however so far I could solve most of my problems - mainly by great forums like this one. Here is one issue that I just can’t solve no meter how much I read up and try different options. It is a very stubborn problem with Accordion spry in DW. It works perfectly in IE and it does not work well in Firefox. The problem is that Firefox accordion remains fixed height of the content panel. When the list is longer than 200px the content overlaps labels underneath instead of extend the height of the content panel. I am trying to fix it for days now and everything fails. I noticed that when I change js this.useFixedPanelHeights = true; to this.useFixedPanelHeights = null it expands one tab correctly but after that all other behaviors are messed up.

The site page is :
http://www.mapkazdaszkiem.com/mapa Gdyni - hotel w Gdyni.html

(the website is in Polish, but don’t worry the site is self-explainable )

The accordion on the left panel is the one that I am talking about above.

I am attaching both SpryAccordion.css and SpryAccordion.js. Could you please please help!!!

 

[jsm4182]

.AccordionPanelContent is set to a height of 200px. IE treats that more like min-height so it expands to fit the content. to get cross browser min-height use

min-height: 200px;
_height: 200px;

Standards compliant browsers use the first declaration, IE uses the second declaration.

 

[kamila3194]

It makes sense , but how exactly can I fix this?

.AccordionPanelContent is set to a height of 200px. IE treats that more like min-height so it expands to fit the content. to get cross browser min-height use

min-height: 200px;
_height: 200px;

Standards compliant browsers use the first declaration, IE uses the second declaration.

How can I make Firefox look at the height just like IE does?

 

[kamila3194]

I have made this change...

How can I make Firefox look at the height just like IE does?

I went to SpryAccordion.css and in now it looks like this:
.AccordionPanelContent {
overflow: visible;
margin: 0px;
padding: 0px;
min-height: 200px;
_height: 200px;
color: #FFF;
visibility: inherit;

..but it still does not wokr correctly in Firefox. The content overlaps other tabs. Should I make other changes - where? Thank you in advence

 

[jsm4182]

I went to SpryAccordion.css and in now it looks like this:
.AccordionPanelContent {
overflow: visible;
margin: 0px;
padding: 0px;
min-height: 200px;
_height: 200px;
color: #FFF;
visibility: inherit;

..but it still does not wokr correctly in Firefox. The content overlaps other tabs. Should I make other changes - where? Thank you in advence

The _height should be the last thing under visibility.

I went to your site but don't see the changes.

 

[kamila3194]

really thank you for trying to help...please stay...

The _height should be the last thing under visibility.

I went to your site but don't see the changes.

I made changes that you suggested, now it looks like this:
.AccordionPanelContent {
overflow: visible;
margin: 0px;
padding: 0px;
color: #FFF;
visibility: inherit;
min-height: 200px;
_height: 200px;

but nothing changed in firefox. Why is the height fixed in Firefox- I don't get it? Is this there other place that I should make changes?
Thank you so much...

 

[jsm4182]

Now that that is fixed I see what is going on. The height value gets overridden by the javascript because you have it set to use fixed height for panels. You had the right idea when you changed that value. If you wrote it exactly as you show in the first post then the problem was you missed the semicolon.

this.useFixedPanelHeights = null;

 

[kamila3194]

You are great it works IT WORKS!!!! THANK YOU

Now that that is fixed I see what is going on. The height value gets overridden by the javascript because you have it set to use fixed height for panels. You had the right idea when you changed that value. If you wrote it exactly as you show in the first post then the problem was you missed the semicolon.

this.useFixedPanelHeights = null;

I actually was not missing the ";" at first. I was careful just to replace the word itself but I think that the fact that you asked me to change the height in css - helped. I am so relieved - it was the only thing so far that was holding me back . As a smart coder - you probably see how amateur the site is - I will get better. Thank you again.