CSSレイアウトの基本が分っていなかった。

多摩美 - メディアリテラシー 2010 HTML5+CSS3 入門にある例を考える。

bodyのwidthが960pxとなっている。ウィンドウとのmarginは20px。

navとsectionのwidthは、それぞれ236pxと620px. コンテンツは、856px。

横にnavとsectionを並べるとmargin, border, paddingは、左右でふたつが2列あるので計4つ。

ひとあたりmarginが5px, borderが1px, paddingが20pxなので、コンテンツ以外の幅は合わせて104px。コンテンツの856pxと合わせてbodyのwidthと一致する。