/    Sign up×
Community /Pin to ProfileBookmark

FF Mac list issues

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: [url]http://karavelshoes.com/upgrade/loopproducts.cfm?category_id=1&mw=1[/url]

to post a comment
CSS

2 Comments(s)

Copy linkTweet thisAlerts:
@bradleybebadauthorJul 28.2009 — 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=#gender#" 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>
Copy linkTweet thisAlerts:
@bradleybebadauthorJul 29.2009 — Figured it out... It was firefox 2.0 on MAC. Found out a hack for 2.0 though

::]
×

Success!

Help @bradleybebad spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...