{"json_modified": "2016-10-10T03:28:42.596383", "uuid": "1498dd2a-951a-4f97-a48a-21b3236f4381", "title": "The box model", "url": "/en-US/docs/Learn/CSS/Introduction_to_CSS/Box_model", "tags": ["margin", "Block", "inline", "Boxes", "Beginner", "height", "CSS", "Learning", "Learn", "Content", "CodingScripting", "background clip", "overflow", "Guide", "box", "Article", "padding", "width", "border", "Model"], "translations": [{"uuid": "81e7beb8-c8f0-42b3-a1cb-4c8f1ee9aefa", "title": "Le mod\u00e8le de bo\u00eete", "url": "/fr/docs/Apprendre/CSS/Les_bases/Le_mod%C3%A8le_de_bo%C3%AEte", "tags": ["CSS", "Learn", "Beginner", "CodingScripting"], "summary": "Dans un document HTML, chaque \u00e9l\u00e9ment est repr\u00e9sent\u00e9 par une bo\u00eete rectangulaire. Le calcul de la taille, des propri\u00e9t\u00e9s (couleur, arri\u00e8re-plan, forme du cadre) et de la position des bo\u00eetes est le r\u00f4le du moteur de rendu. En CSS, chacune de ces bo\u00eetes est d\u00e9crite \u00e0 partir d'un mod\u00e8le standard qui permet de d\u00e9crire le contenu de l'espace occup\u00e9 par un \u00e9l\u00e9ment.", "localization_tags": [], "locale": "fr", "last_edit": "2016-01-12T11:41:03", "review_tags": []}, {"uuid": "2d9cc39c-fb22-4802-93ba-f296b9d397f4", "title": "Box model", "url": "/it/docs/Learn/CSS/Basics/Box_model", "tags": [], "summary": "In un documento HTML, ogni elemento \u00e8 rappresentato da un box rettangolare.\u00a0Determinare la dimensione, le propiet\u00e0 \u2014 come il colore, il background, l'aspetto del bordo\u00a0\u2014 e la posizione di questi box \u00e8 l'obiettivo del\u00a0rendering engine. In CSS, ciascuno di questi box rettangolari \u00e8 descritto utilizzando lo\u00a0standard box model. Questo modello descrive il contenuto dello spazio che ogni elemento occupa.", "localization_tags": ["inprogress"], "locale": "it", "last_edit": "2016-01-23T23:57:09", "review_tags": ["technical"]}], "modified": "2016-10-10T03:28:41", "label": "The box model", "localization_tags": [], "locale": "en-US", "id": 166419, "last_edit": "2016-10-10T03:28:28", "summary": "The CSS box model is the foundation of layout on the Web \u2014 each element is represented as a rectangular box, with the box's content, padding, border, and margin built up around one another like the layers of an onion. As a browser renders a web page layout, it works out what styles are applied to the content of each box, how big the surrounding onion layers are, and where the boxes sit in relation to one another. Before understanding how to create CSS layouts, you need to understand the box model \u2014 this is what we'll look at in this article.", "sections": [{"id": "Quick_Links", "title": null}, {"id": "Box_properties", "title": "Box properties"}, {"id": "Active_learning_playing_with_boxes", "title": "Active learning: playing with boxes"}, {"id": "Playable_code", "title": "Playable code"}, {"id": "Advanced_box_manipulation", "title": "Advanced box manipulation"}, {"id": "Overflow", "title": "Overflow"}, {"id": "Background_clip", "title": "Background clip"}, {"id": "Outline", "title": "Outline"}, {"id": "Types_of_CSS_boxes", "title": "Types of CSS boxes"}, {"id": "What's_next", "title": "What's next"}], "slug": "Learn/CSS/Introduction_to_CSS/Box_model", "review_tags": []}