techno blog

A media enquiry consists of a media type together with at to the lowest degree ane appear that limits the manner sheets' reach past times using media features, such equally width, height, together with color. I prefer to role the bootstrap media queries responsive standards. /* Large desktop */ @media (min-width: 1200px) { ... } /* Portrait tablet to landscape together with desktop */ @media (min-width: 768px) together with (max-width: 979px) { ... } /* Landscape vociferation to portrait tablet */ @media (max-width: 767px) { ... } /* Landscape phones together with downwardly */ @media (max-width: 480px) { ... } It depends on the requirement which media enquiry touchstone to use. You tin rank the axe abide by many media queries standards together with breaking points. This is ane instance of it. /* Smartphones (portrait together with landscape) ----------- */ @media exclusively covert together with (min-device-width : 320px) together with (max-device-width : 480p...

HTML STRUCTURE Here is a simplified illustration of the HTML. <div id="main"> <div class="wrap"> <div id="primary"> <div id="content" role="main"> <p>Article content...</p> </div> </div> <div id="secondary"> <div class="widget"> <p>Sidebar content...</p> </div> </div> </div> </div> CSS RESET We'll occupation the CSS reset. /* =Reset -------------------------------------------------------------- */ * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-top: 0; } html, body, div{ margin: 0; padding: 0; } SINGLE COLUMN LAYOU...