Click to See Complete Forum and Search --> : FF Mac list issues


bradleybebad
07-28-2009, 12:09 AM
I have a menu that is populated using coldfusion and sql. The code works fine, but my css is acting a little weird in ff mac. I have a <ul> with a <li> in it that needs to be display:inline-block. I need the menu <li> to be displayed without line breaks. It works fine in all the others, but in ff mac it does not take away the break if I use inline-block.

ANY IDEA?

Link: http://karavelshoes.com/upgrade/loopproducts.cfm?category_id=1&mw=1

bradleybebad
07-28-2009, 02:30 PM
This might be easier if I paste the code here...

CSS:

.menu {
margin:9px 0px 0px 0px;
}

.menu ul {padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;list-style-type:none;width:100%;}

.menu li {
position:relative;
display:inline-block;
}
.menu li a, ul.menu li a:visited {

text-decoration:none;
border:1px #CCCCCC solid;
padding:0px 5px 0px 5px;
margin:0px 4px 15px 0px;
width:112px; height:112px;
display:block;

}
.menu li a:hover
{
text-decoration:none;
border-width:1px;
border-color:#666666;
border-style:solid;

}
.menu li li {
position:relative;
background:#FFFFFF;
border:1px #666666 solid;
width:269px;
padding:0px 0px 45px 0px;
}
.menu p {
position:relative; left:20px; top:10px;


}
.menu ul ul.drop {
visibility:hidden;
position:absolute;
width:277px;
top:40px;left:10px;
padding:0px 0px 0px 23px;
z-index:999999;
}
.menu ul ul.drop2 {
visibility:hidden;
position:absolute;
width:300px;
top:40px;left:-70px;
z-index:999999;
}

/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{}
.menu :hover > a, .menu ul ul :hover > a {}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible; }






HTML:


<div class="menu">
<ul>

<cfif IsDefined("URL.category_id") AND IsDefined("URL.subcat_id")>

<cfloop query="getproducts" StartRow="#URL.StartRow#" EndRow="#EndRow#">
<cfoutput>



<li>

<a href="productdisplay.cfm?category_id=#URL.category_id#&amp;subcat_id=#getproducts.subcat_id#&amp;sku=#sku#&amp;mw=#gen der#" style="background: url(#thumbsfolder##sku#.jpg) center no-repeat;"><!--[if IE 7]><!--></a><!--<![endif]-->

<!--[if !IE]>-->
<ul class="#style#">
<li>
<p>
<b>Product:</b> #product_name#<br>
<b>Price:</b> #LSCurrencyFormat(price)#<br>
<b>Item Number:</b> #sku#
</p>

<img src="#prodpicsfolder##sku#.jpg" width="220px" alt="#product_name#" style="position:relative; left:23px; top:30px;">


</li>


</ul>
<!--<![endif]-->

</li>

<cfset counter = counter + 1>

</cfoutput>
</cfloop>
</cfif>



</ul>

bradleybebad
07-29-2009, 02:19 PM
Figured it out... It was firefox 2.0 on MAC. Found out a hack for 2.0 though
::]