Html 使浮动li'；整个ul宽度范围内的s跨度

非常简单HTML:

<div id="medium_ribbon">    
  <ul class="up_rectangles">
   <li id="first_up">
     <img src="img/home1.png" width="200" height="135" class="scalable">
   </li>
   <li id="second_up">
      <img src="img/home2.png" width="200" height="135" class="scalable">
   </li>
   <li id="third_up">
      <img src="img/home3.png" width="200" height="135" class="scalable">
   </li>
   <li id="fourth_up">
     <img src="img/home4.png" width="200" height="135" class="scalable">
   </li>    
  </ul>
</div><!--medium_ribbon-->   

你可以在现场看到它

我的问题是，为什么第四个方框没有延伸到红色边界线的末端，从而跨越整个ul宽度。不包括li边界的百分比总和为98.7%。剩下的1.3%应该分配给八个（左-右…）边界。为什么整个ul宽度没有填充？通过尝试增加边框宽度（从细到中），第四个框将失去其位置并转到下一行。我也尝试过用百分比来表示边框宽度，但没有效果。。。 有没有办法跨越我的李家一直走到最右边

谢谢

试试这个

.up_rectangles li{margin-right: 1.45%}
.up_rectangles > li:last-child { float: right; margin-right: 0;}

试试这个

.up_rectangles>li:last-child { margin-right:0;border:solid 2px #C8CACF !important;}

或

---

你确定你的计算是正确的吗？如果我设置

.up_矩形{margin right:1.6%；}

，它似乎会像您预期的那样工作。

.up_rectangles>li:last-child { margin-right:0;border:solid 2px #C8CACF !important;}

.up_rectangles>li:last-child {margin-right:0;border:solid 0px #C8CACF !important;float:right;}