小测验（第1期）
前沿教室的朋友，大家好！
今天给大家出一个小测验题目，有兴趣的可以计算一下，把您计算出的答案根贴在后面，看看谁是第一个回答出正确答案的朋友！今天出一道“计算题”。
大家都知道，用CSS可以对页面的内容实现“像素级”的精确布局和控制，那么假设有如下的一段CSS设置，以及HTML代码：
CSS代码：
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | body{ margin:0; } #outerBox{ width:200px; height:100px; margin:10px auto; padding:5px; border:1px black solid; } #innerBox{ position:absolute; top:70px; width:100px; height:50px; border:1px black solid; } |
相应的HTML代码为：
1 2 3 4 5 | <body>
<div id="outerBox">
<div id="innerBox"></div>
</div>
</body> |
如果现在用Firefox或者IE6/7浏览器，察看该页面，浏览器窗口的宽度为400像素，请问innerBox这个div的边框的右下角坐标应该等于多少？这里假设浏览器窗口左上角点的坐标为(0,0)。
好了,问题说完了,请有兴趣的读者算一算吧，把你计算出的答案发表在本文的评论中，简单描述一下得到这个结果的计算原理和过程。
3,954
122，102呵呵
这个测试发表于07年，我来晚呢。呵。。
你好！
我的计算结果是 X：251 Y：122
盒子innerBox 的宽度再加2个像素的边框总宽为 102 个像素。 高度加上2个像素的边框总高为52个像素。 另外就是 top 距离浏览器的上部70个像素。
（浏览器窗口）400像素 - （盒子宽度）102像素 = 298像素；
由于盒子没有设置 left属性。 所以居中，然后用298像素除以2 = 149像素。
149像素 + 102像素 = 251像素。 （得出X为 251像素）；
（盒子高度）52像素 + （top值）70像素 = 122像素； （得出Y为 122像素）
旅途 ，
这个计算应该是正确的，当年出这个问题的初衷是要说明一个问题，绝对定位的盒子，如果再水平或竖直方向没有设定top、bottom、left、right的情况下，会如何定位。
例如这个例子中，设置了top，因此，这个盒子会以body为基准，向下移动70像素，而在水平方向，既没有设置left，也没有设置right，那么他会按照标准流中的默认情况设置，因此它的左边会和外面盒子的左边对齐。
前沿的老师们好！
我是在08年无意中搜索到贵网站。看到几乎每个网友的留言都有你们的回复。让我决心在贵网站多停留一下，于是乎一发而不可收拾呢。呵呵。。
当时的工作还在用那老套的表格进行了布局。后来在贵网站下了一部分视频教程。觉得蛮不错。
前后便买了《精通CSS》和《彻底研究》。现在用CSS进行一个常规布局也没有太大的问题呢。在学习刚开始时，做案例遇到最大的问题就是IE对呢，火狐不对，火狐对了，IE又错呢。
不过还好，在对两本书完全学完之后，现在基本上已经能对IE6.0/7.0/8.0 和火狐都能达到兼容。
个人觉得真正想学好一门技术，还是得看书，视频固然重要，它能帮助我们对书上有些文字的描述的不理解进行很好的解释，但不能完全顾及到方方面面。想先真正掌握CSS，看书还是最为系统的。
现在学习完前沿的两本CSS书后，我开始每天做一个案例。毕竟实践才是最重要的。
另一方面我现在也开始着手自学前沿的《精通JS+JQ》这本书呢。进行了大概十天左右。学起来感觉有点吃力，有时还得慢慢对一个问题分析再分析，想了再想。才能明白过来。
自学是艰苦的滴。。。唉，这段时间的学习进度不是很快。
在前沿潜水很长时间啦，一直没有留言。真是抱歉。呵。。其实一开始也不知道说些什么好？还是支持前沿的教程是最好的选择吧。
最后还得感谢前沿所有的老师们。谢谢你们的书。
旅途 ，
非常感谢您对我们的支持，以及诚恳的留言。
非常高兴我们的教程和图书对您的工作学习有所帮助！
关于您谈到的学习JS的问题，对于没有写过程序的读者来说，确实是有一点困难的，主要原因是学程序需要一些基础，我一直想写一篇文章具体谈一谈这个问题，争取尽快写出来。
原则上来说，我还是建议找一门静态语言作为第一门程序语言，另外，配合一些编程的基础课，自学一下，关键是要对底层的支持了解更多一些，在学习JS或者任何其它的编程语言，都是相通的，就会容易了。
应该是206，122吧 上次看错了
Kim ，
NO，用浏览器实际试验一下？
是106，122吗
kim，
No，实际试试看~~
比较早的文章了。。。
我算算，我的前提是使用的是标准盒子模型：
由于 innerBox 定义了 position:absolute，而它的父元素 outerBox 没有设 position:relative，所以 innerBox 绝对定位是以浏览器窗口为准的。所以我算的结果是左100+2=102，上70+50+2=122，即102，122
青色 ,
No，用Firebug看一下~~
IE下是(207,137)
FF下是(205,135)
IE下盒子的宽度不包括border,FF下设置的width包括width，所以IE比FF下多2px，其余的根据盒子模型画出来，
楼主答案是什么啊？我对了没？不对的话请提点，谢谢！！！
枫崖，
IE 6 以后width的定义和FF是一样的，不过这个题目要问的不是这个问题。
你可以用实际浏览器看一下效果~~
楼主，我对这个问题很敢兴趣，不知道能否告诉我答案？