解这样的方程式，有点类似哥德巴赫猜想了，好像有必要写个程序来搞定。幸好这一次，我们有强大的笨笨熊童鞋，写出了这样一段程序：

public class test1 {
  private static float decimal = 0.0001f;
 public static void main(String[] args) {
  int count = 1;
  int result_x = 0;
  int result_y = 0;
  for (float x = 0.33f; x < 0.34f; x = x + decimal) {
   for (float y = 0.33f; y < 0.34f; y = y + decimal) {
   if (((Math.floor(312 * x) + Math.floor(312 * x) + Math.floor(312 * y)) == 312) &&
   ((Math.floor(472 * x) + Math.floor(472 * x) + Math.floor(472 * y)) == 472) ) {
    System.out.printf("x==>%.4f,y==>%.4f\n" ,x, y);
    }
   }
  }
  System.out.println("result_x==>" + result_x + ",result_y==>" + result_y);
 }
}

好吧，相信万能的机器，总是什么都能做出来的。运行以上程序，一下就输出了几百组结果，X取值从-33.06%—33.47%，Y从33.48%—33.4%，从中选出最接近的1组：

x=33.47%
y=33.48%

好了，给CSS设置：

.tab3 li{float:left;width:33.47%;}
.tab3 li:last-child{width:33.48%;}

[再提一点，对Firefox浏览器要满足的条件如下：

（312*X） + （312*X）+（312*Y）=312，同时（472*X） + （472*X）+（472*Y）=472，

基本上就是2X+Y=1，而通过程序运算，我们发现找不到这样一组4位以内的数值能同时满足Firefox和Safari的条件，好在目前在高端机的网页上，我们还不需要兼容Firefox——如果有谁知道-moz或-webkit设置宽度的私有属性，请告诉我，可以分别给他们定义宽度。]

这样就行啦！

这时，有一个弱弱的声音在问：但是，请问，请问，我们每次都要这么痛苦么！

好，问的好！

在经历了这一番死去活来的推理计算后，一直觉得如鲠在喉，心有不甘。突然有一天，脑子里灵光一现，柳暗花明又一村…让我们换个思路吧：

一定要给每个选项卡定义精确宽度么？能不都定义么？如果我们只定义其中前N-1个，而让最后一个自适应会如何？像这样：

.tab3 li:not(:last-child){float:left;width:33.33%;}
.tab3 li:last-child{margin-left:66.66;}

正所谓大巧无术、大道至简，换一种思路，海阔天空。

原文：http://wsd.tencent.com/2010/08/tab.html

本文链接：http://www.blueidea.com/tech/web/2010/7917.asp　

出处：腾讯WSD
责任编辑：bluehearts

上一页 一个选项卡宽度的哥德巴赫猜想 [3] 下一页

◎进入论坛网页制作、WEB标准化版块参加讨论，我还想发表评论。