三级分类,上面很大的空,求助帮我改一下代码,谢谢!

2016-07-07 16:15 来源:www.chinab4c.com 作者:ecshop专家



category_tree文件:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<div class="box">
<div class="box_1">
<div id="category_tree">

<div class="web_title">

<span class="title">产品分类</span>

<span class="letter"> | CATEGORIES</span>

</div>

<!--{foreach from=$categories item=cat}-->

<p class="maincate01"> <a href="{$cat.url}">{$cat.name|escape:html}</a> </p>
<!--{foreach from=$cat.cat_id item=child}-->


<p class="maincate02" > <a href="{$child.url}">{$child.name|escape:html}</a> </p>


<ul>
<!--{foreach from=$child.cat_id item=childer}-->

<a href="{$childer.url}">{$childer.name|escape:html}</a>

<!--{/foreach}-->
</ul>

<!--{/foreach}-->


<!--{/foreach}-->

</div>
</div>
</div>
<div class="blank5"></div>



CSS源码:
/*商品分类*/
#category_tree{border:4px solid #95D6FE; background-color:#FFF;}

#category_tree .web_title{font-weight:bold; color:#007DC5; padding-left:15px; background-color:#95D6FE; height:25px;}

.maincate01 {background:url(images/lineBg.gif) repeat-x left bottom;color:#3f3f3f;padding:2px 0 3px 12px; margin-top:10px;}
.maincate01 a{background:url(images/bg.gif) no-repeat 0 -69px;color:#006BEF; padding-left:15px; text-decoration:none; font-weight:bold;}
.maincate01 a:hover{color:#0090E3; text-decoration:none;}

.maincate02 {color:#3f3f3f;padding-left:10px; margin-top:0px; font-weight:bold;}
.maincate02 a{color:#0090E3; text-decoration:none;}
.maincate02 a:hover{color:#0090E3; text-decoration:none;}

#category_tree ul{color:#323232;padding-left:10px; width:160px; overflow:hidden;}
#category_tree ul a{color:#323232; text-decoration:none; min-width:70px; _width:70px;white-space:nowrap; display:block; float:left;}
#category_tree ul a:hover{color:#323232; text-decoration:none;}

banzu.jpg (42.11 KB)

banzu.jpg


回答:


1# ownfeel

已解决:
把:" #category_tree ul a{color:#323232; text-decoration:none; min-width:70px; _width:70px;white-space:nowrap; display:block; float:left;}
"
改成以下:

#category_tree ul a{color:#323232; text-decoration:none; min-width:75px; _width:75px;white-space:nowrap; }

也就是把: "display:block; float:left;"去掉就OK了

banzu.jpg (59.44 KB)

banzu.jpg


虽然已解决,因为我不懂, 所以我不知道我的代码在不同的浏览器上会不会出错,希望大家帮我看一下,有没有需要修正的地方,谢谢!

你可以下载火狐 和 IETester
来测试下。一般只要火狐 和ie6.0 7.0 8.0 通过的,那么主流浏览器都是没问题的。