CSS style being overridden in Firefox
this problem has had me stumped all day.  I'm using Firefox 8 and I have a UL element that's located inside a div tag, the div tag is animated with the jQuery UI Accordion widget as the following markup shows:

    <div id="accordion">
        <a class="ui-accordion-header">Section 1</a>
        <ul style="width: 250px !important;">
           <li>
        	  <dl id="MyDefinitionList"></dl>
           </li>
        </ul>
    </div>

My problem is that in Firefox the inline width style for the <ul> tag gets overwritten and reset to 0px.  So the above ends up getting rendered in Firefox as follows:


    <div id="accordion">
        <a class="ui-accordion-header">Section 1</a>
        <ul style="width: 0px;">
           <li>
        	  <dl id="MyDefinitionList"></dl>
           </li>
        </ul>
    </div>


This does not happen in Chrome or IE and I have no idea what is causing this in FF.  Ideally I would like to set the style from jQuery, I had just set it inline to test and sure enough it gets overwritten and reset back to 0px.  Is there some browser setting or feature in the Firefox rendering engine that causes this behavior.  Any help is appreciated as we are currently trying to get this web app pushed out and it must be cross-browser compatible.  Thanks
CSS style being overridden in Firefox
===

this problem has had me stumped all day.  I'm using Firefox 8 and I have a UL element that's located inside a div tag, the div tag is animated with the jQuery UI Accordion widget as the following markup shows:

    <div id="accordion">
        <a class="ui-accordion-header">Section 1</a>
        <ul style="width: 250px !important;">
           <li>
        	  <dl id="MyDefinitionList"></dl>
           </li>
        </ul>
    </div>

My problem is that in Firefox the inline width style for the <ul> tag gets overwritten and reset to 0px.  So the above ends up getting rendered in Firefox as follows:


    <div id="accordion">
        <a class="ui-accordion-header">Section 1</a>
        <ul style="width: 0px;">
           <li>
        	  <dl id="MyDefinitionList"></dl>
           </li>
        </ul>
    </div>


This does not happen in Chrome or IE and I have no idea what is causing this in FF.  Ideally I would like to set the style from jQuery, I had just set it inline to test and sure enough it gets overwritten and reset back to 0px.  Is there some browser setting or feature in the Firefox rendering engine that causes this behavior.  Any help is appreciated as we are currently trying to get this web app pushed out and it must be cross-browser compatible.  Thanks