因為設置了absolute的元素脫離的文檔流 飄起來了?

在此處，設置成100%和設置成200px的效果是一樣的。但是你會發(fā)現(xiàn)紅框無法重合，原因通俗來講是：box4是box3的子元素，box4的左上角那個像素點與box3內(nèi)的元素的最左邊（而非box3的邊框）的像素重合·，這樣導致boxd4的邊框的最右端比box3的邊框的最右端多出2個像素（div中border設為2px時多出2個像素點，若border設為1px時看起來多出來1個像素點）。但你發(fā)現(xiàn)多出來不止2個像素，其實就是2個像素，看起來中間有一條白線的原因是瀏覽器的顯示問題，box3最右邊的那條邊框與box4最右邊的那條邊框就是緊挨的，若是想仔細觀察可以放大瀏覽器（按住crtl加滾輪），會發(fā)現(xiàn)在放大過程中那條白線時有時無，實際上是沒有的。若是想讓他們完全對齊，可以在box4的css里加一個偏移：margin-left:-2px;其中2與其父類div里border屬性對應。

至于為什么那條白縫在放大時時有時無，那我作為初學者也不知道?。

可能是

box3是相對位置(position:relative)

box4是絕對位置(position:absolute)

的原因，你看兩個方框左邊都不對齊