{"id":1592,"date":"2021-05-03T13:08:18","date_gmt":"2021-05-03T13:08:18","guid":{"rendered":"https:\/\/www.dwallindia.com\/pineta_new\/?page_id=1592"},"modified":"2021-05-03T13:08:18","modified_gmt":"2021-05-03T13:08:18","slug":"grid-system","status":"publish","type":"page","link":"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/","title":{"rendered":"Grid System"},"content":{"rendered":"<p>The default grid system utilizes\u00a0<strong>12 columns<\/strong>, making for a 1200px wide container. Below\u00a0<strong>800px<\/strong>\u00a0viewport size, the columns become stacked vertically.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\"\/>\n<h3>Two Columns with the same width<\/h3>\n<div class=\"pixcode  pixcode--row  row  \">\n<div class=\"col-12  hand-span-6 \">\n\n<p>In graphic design, a grid is a structure made up of a series of intersecting straight (vertical, horizontal, and angular) or curved guide lines used to structure content. The grid serves as an armature on which a designer can organize graphic elements in a rational, easy to absorb manner. A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page, or relation to other parts of the same graphic element or shape.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n<div class=\"col-12  hand-span-6 \">\n\n<p>In graphic design, a grid is a structure made up of a series of intersecting straight (vertical, horizontal, and angular) or curved guide lines used to structure content. The grid serves as an armature on which a designer can organize graphic elements in a rational, easy to absorb manner. A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page, or relation to other parts of the same graphic element or shape.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n\n<\/div>\n\n<h3>Three Columns with the same width<\/h3>\n<div class=\"pixcode  pixcode--row  row  \">\n<div class=\"col-12  hand-span-4 \">\n\n<p>In graphic design, a grid is a structure made up of a series of intersecting straight (vertical, horizontal, and angular) or curved guide lines used to structure content. The grid serves as an armature on which a designer can organize graphic elements in a rational, easy to absorb manner.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n<div class=\"col-12  hand-span-4 \">\n\n<p>In graphic design, a grid is a structure made up of a series of intersecting straight (vertical, horizontal, and angular) or curved guide lines used to structure content. The grid serves as an armature on which a designer can organize graphic elements in a rational, easy to absorb manner.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n<div class=\"col-12  hand-span-4 \">\n\n<p>In graphic design, a grid is a structure made up of a series of intersecting straight (vertical, horizontal, and angular) or curved guide lines used to structure content. The grid serves as an armature on which a designer can organize graphic elements in a rational, easy to absorb manner.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n\n<\/div>\n\n<h3>Four Columns with the same width<\/h3>\n<div class=\"pixcode  pixcode--row  row  \">\n<div class=\"col-12  hand-span-3 \">\n\n<p>A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page, or relation to other parts of the same graphic element or shape.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n<div class=\"col-12  hand-span-3 \">\n\n<p>A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page, or relation to other parts of the same graphic element or shape.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n<div class=\"col-12  hand-span-3 \">\n\n<p>A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page, or relation to other parts of the same graphic element or shape.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n<div class=\"col-12  hand-span-3 \">\n\n<p>A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page, or relation to other parts of the same graphic element or shape.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n\n<\/div>\n\n<h3>Three Columns Different Sizes (3 + 4 + 5)<\/h3>\n<div class=\"pixcode  pixcode--row  row  \">\n<div class=\"col-12  hand-span-3 \">\n\n<p>A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n<div class=\"col-12  hand-span-4 \">\n\n<p>A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page, or relation to other parts of the same graphic element or shape.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n<div class=\"col-12  hand-span-5 \">\n\n<p>A grid can be use to organize graphic elements in relation to a page, in relation to other graphic elements on the page, or relation to other parts of the same graphic element or shape\u00a0, or relation to other parts of the same graphic element or shape.<\/p>\n<hr class=\"pixcode  pixcode--separator  separator\" \/>\n\n<\/div>\n\n<\/div>\n\n<blockquote><p>The grid system is an aid, not a guarantee. It permits a number of possible uses and each designer can look for a solution appropriate to his personal style. But one must learn how to use the grid; it is an art that requires practice.<\/p><\/blockquote>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The default grid system utilizes\u00a012 columns, making for a 1200px wide container. Below\u00a0800px\u00a0viewport size, the columns become stacked vertically. Two Columns with the same width Three Columns with the same width Four Columns with the same width Three Columns Different Sizes (3 + 4 + 5) The grid system is an aid, not a guarantee. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1592","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Grid System - Pineta 1903<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Grid System - Pineta 1903\" \/>\n<meta property=\"og:description\" content=\"The default grid system utilizes\u00a012 columns, making for a 1200px wide container. Below\u00a0800px\u00a0viewport size, the columns become stacked vertically. Two Columns with the same width Three Columns with the same width Four Columns with the same width Three Columns Different Sizes (3 + 4 + 5) The grid system is an aid, not a guarantee. [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/\" \/>\n<meta property=\"og:site_name\" content=\"Pineta 1903\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/ristorantepineta1903\/\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/en\\\/grid-system\\\/\",\"url\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/en\\\/grid-system\\\/\",\"name\":\"Grid System - Pineta 1903\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/#website\"},\"datePublished\":\"2021-05-03T13:08:18+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/en\\\/grid-system\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.ristorantepineta1903.it\\\/en\\\/grid-system\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/en\\\/grid-system\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/en\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Grid System\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/#website\",\"url\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/\",\"name\":\"Pineta 1903\",\"description\":\"L&#039;Autentica Cucina di Mare della Costa d&#039;Amalfi con un pizzico di innovazione ed abbinamenti inaspettati\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/#organization\",\"name\":\"ristorantepineta1903\",\"url\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/wp-content\\\/uploads\\\/cropped-logo_rosso_trasp.png\",\"contentUrl\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/wp-content\\\/uploads\\\/cropped-logo_rosso_trasp.png\",\"width\":512,\"height\":512,\"caption\":\"ristorantepineta1903\"},\"image\":{\"@id\":\"https:\\\/\\\/www.ristorantepineta1903.it\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/ristorantepineta1903\\\/\",\"https:\\\/\\\/www.instagram.com\\\/ristorantepineta1903\\\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Grid System - Pineta 1903","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/","og_locale":"en_US","og_type":"article","og_title":"Grid System - Pineta 1903","og_description":"The default grid system utilizes\u00a012 columns, making for a 1200px wide container. Below\u00a0800px\u00a0viewport size, the columns become stacked vertically. Two Columns with the same width Three Columns with the same width Four Columns with the same width Three Columns Different Sizes (3 + 4 + 5) The grid system is an aid, not a guarantee. [&hellip;]","og_url":"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/","og_site_name":"Pineta 1903","article_publisher":"https:\/\/www.facebook.com\/ristorantepineta1903\/","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/","url":"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/","name":"Grid System - Pineta 1903","isPartOf":{"@id":"https:\/\/www.ristorantepineta1903.it\/#website"},"datePublished":"2021-05-03T13:08:18+00:00","breadcrumb":{"@id":"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.ristorantepineta1903.it\/en\/grid-system\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.ristorantepineta1903.it\/en\/"},{"@type":"ListItem","position":2,"name":"Grid System"}]},{"@type":"WebSite","@id":"https:\/\/www.ristorantepineta1903.it\/#website","url":"https:\/\/www.ristorantepineta1903.it\/","name":"Pineta 1903","description":"L&#039;Autentica Cucina di Mare della Costa d&#039;Amalfi con un pizzico di innovazione ed abbinamenti inaspettati","publisher":{"@id":"https:\/\/www.ristorantepineta1903.it\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.ristorantepineta1903.it\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.ristorantepineta1903.it\/#organization","name":"ristorantepineta1903","url":"https:\/\/www.ristorantepineta1903.it\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.ristorantepineta1903.it\/#\/schema\/logo\/image\/","url":"https:\/\/www.ristorantepineta1903.it\/wp-content\/uploads\/cropped-logo_rosso_trasp.png","contentUrl":"https:\/\/www.ristorantepineta1903.it\/wp-content\/uploads\/cropped-logo_rosso_trasp.png","width":512,"height":512,"caption":"ristorantepineta1903"},"image":{"@id":"https:\/\/www.ristorantepineta1903.it\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/ristorantepineta1903\/","https:\/\/www.instagram.com\/ristorantepineta1903\/"]}]}},"_links":{"self":[{"href":"https:\/\/www.ristorantepineta1903.it\/en\/wp-json\/wp\/v2\/pages\/1592","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ristorantepineta1903.it\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.ristorantepineta1903.it\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.ristorantepineta1903.it\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ristorantepineta1903.it\/en\/wp-json\/wp\/v2\/comments?post=1592"}],"version-history":[{"count":0,"href":"https:\/\/www.ristorantepineta1903.it\/en\/wp-json\/wp\/v2\/pages\/1592\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.ristorantepineta1903.it\/en\/wp-json\/wp\/v2\/media?parent=1592"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}