HTML5, CSS3 - Getting Started on the Mobile Web: Responsive WebDesign(width, margin, percentage)

Head First Mobile Web (Brain-Friendly Guides)
(O'Reilly Media)
Lyza Danger Gardner (著)

開発環境

• OS X Yosemite - Apple (OS)
• Safari, Firefox, Google Chrome(Webプラウザ)
• Emacs (CUI)、BBEdit - Bare Bones Software, Inc.(GUI) (Text Editor)

Head First Mobile Web (Brain-Friendly Guides)(Lyza Danger Gardner (著)、O'Reilly Media)のChapter 1(Getting Started on the Mobile Web: Responsive Web Design)、EXERCISE(No. 844)を解いてみる。

その他参考書籍

• Head First HTML and CSS

EXERCISE(No. 844)

CSS3(BBEdit, Emacs)

@media screen and (min-width:481px) {
    body, header, footer, nav {
        width: 100%;
    }
    column {
        margin: 10px 1.0416666667 0 0;
    }
    nav ul li {
        width: 33.3333333%;
    }
    #visit {
        width: 25%;
        float: left;
    }
    #points {
        width: 25%;
        float: right;
    }
    #main {
        margin: 10px 27.0833333% 0 26.0416667%;
    }
}