layout01-在布局ul时，给li设置margin-right的时候，每行的最后一个li有margin-right 导致ul 看上去不居中的问题

在布局ul时，给li设置margin-right的时候，每行的最后一个li有margin-right 导致ul 看上去不居中的问题

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6     <link rel="stylesheet" type="text/css" href="http://css.40017.cn/cn/min/??/cn/c/zt/2013/ztBase.css?v=13080902">
 7     <style>
 8         .con{width: 980px;margin: 0 auto;background-color: red;margin-bottom: 30px;}
 9         .con .zy{width: 872px;margin: 0 auto;overflow: hidden;}
10         .con ul{width:898px;}
11         .con ul li{float:left;width: 280px;height: 290px;background-color: #fff;margin:0px 16px 10px 0px;}
12 
13         .con2{width: 980px;margin: 0 auto;background-color: blueviolet;}
14         .con2 ul{padding: 0px 46px;}
15         .con2 ul li{float:left;width: 280px;height: 290px;background-color: #fff;margin:0px 8px 10px 8px;}
16 
17     </style>
18 </head>
19 <body>
20     <div class="con">
21         <div class="zy">
22             <ul class="clearfix">
23                 <li></li>
24                 <li></li>
25                 <li></li>
26                 <li></li>
27                 <li></li>
28                 <li></li>
29             </ul>
30         </div>
31     </div>
32     <div class="con2">
33         <ul class="clearfix">
34             <li></li>
35             <li></li>
36             <li></li>
37             <li></li>
38             <li></li>
39             <li></li>
40         </ul>
41     </div>
42 
43 </body>
44 </html>
View Code

 

posted @ 2015-05-13 14:26  zhouyan_jsj  Views(391)  Comments(0)  Edit  收藏  举报