要素の幅、高さに対し、パディング、ボーダー、マージンが順に外側を包むようになりますが、
その要素をTop、Leftで配置しようとした場合、ボーダーの左上端が配置原点になる。
例
1 2 3 4 5 6 7 8 9 | <!doctype html><meta charset="utf-8" />div in div and border</pre><div style="position: relative; margin: 10px auto; width: 100px; height: 100px; background-color: #ff0;"><div style="position: absolute; width: 50px; height: 50px; background-color: #666; top: 20px; left: 20px;"><img style="border: #000 solid 10px;" alt="" src="mark16.png" /></div></div><pre> |
ボーダー付き要素のTop、Left配置