#theboxmodel

Elements in CSS are described as being ‘in flow’ or ‘out of flow.’ Elements in flow are given space and that space is respected by the other elements in flow. If you take an element out of flow, by floating or positioning it, then the space for that element will no longer be respected by other in flow items.

 This week, we expanded our CSS capabilities a little more,  learning and applying topics such as colors, the box model, layout, links/lists. Colors has definitely brought a new dimension to CSS by completely destroying that boring character of HTML. With The box model, we understood how we can separate and position the contents, and add a different character to each content. Deciding on the layout of the page is actually making the design decisions of the page. In fact, things always gets a little more difficult when the design is included in the work, but the more the design is involved, the simpler the result becomes. The more simplified the result, the more beautiful and consumable it is.

 I’ll put this explanation of CSS Box Model here,

The browser renders all elements as rectangles. Dubbed the CSS box model, the size of these rectangles are determined by margin, padding, border, and the content itself. Margin is set by the margin property and the same applies to the padding and border properties. Size of the content is determined by the content itself.