{"id":10572,"date":"2025-09-14T17:15:41","date_gmt":"2025-09-14T17:15:41","guid":{"rendered":"https:\/\/tableberg.com\/?post_type=table_pattern&#038;p=10572"},"modified":"2025-09-14T17:21:34","modified_gmt":"2025-09-14T17:21:34","slug":"four-column-info-boxes","status":"publish","type":"table_pattern","link":"https:\/\/tableberg.com\/fr\/table-patterns\/four-column-info-boxes\/","title":{"rendered":"Four-Column Info Boxes"},"content":{"rendered":"<div class=\"wp-block-tableberg-wrapper tableberg-border-col-only wp-block-tableberg-table\" >\n\t\t\t<div class=\"tableberg-table-wrapper\" style=\"\">\n\t\t\t\t<table class = \"\" style=\"border-spacing: 8px 0; --tableberg-cell-padding-top: var(--wp--preset--spacing--small); --tableberg-cell-padding-bottom: var(--wp--preset--spacing--small); --tableberg-inner-border-top: none; \" data-tableberg-header=\"\" data-tableberg-footer=\"\" data-tableberg-responsive data-tableberg-rows=\"2\" data-tableberg-cols=\"4\" data-tableberg-mobile-width=\"700\" data-tableberg-mobile-mode=\"stack\" data-tableberg-mobile-direction=\"col\" data-tableberg-mobile-count=\"1\" ><colgroup><col style=\"width: 25%; min-width: 25%; background: #3c82f6; \"\/><col style=\"width: 25%; min-width: 25%; background: #d5b89c; \"\/><col style=\"width: 25%; min-width: 25%; background: #cde7c5; \"\/><col style=\"width: 25%; min-width: 25%; background: #f3dce5; \"\/><\/colgroup><tbody><tr class=\"tableberg-odd-row\" style=\"\">\n<td data-tableberg-row=\"0\" data-tableberg-col=\"0\" style=\"--tableberg-col-border-top: 0px none ; --tableberg-col-border-right: 0px none ; --tableberg-col-border-bottom: 0px none ; --tableberg-col-border-left: 0px none ; --tableberg-col-top-left: 8px; --tableberg-col-top-right: 8px; --tableberg-col-bottom-right: 8px; --tableberg-col-bottom-left: 8px; \" class=\"wp-block-tableberg-cell tableberg-v-align-center\"><div class=\"tableberg-cell-inner\" style=\"display: block; justify-content: center; flex-wrap: wrap; \">\n<p class=\"has-text-align-center has-base-color has-text-color has-link-color wp-elements-b4cf4b88cc602bc6e8fae2b82e6f1dba\"><strong>Why do we use it?<\/strong><\/p>\n<\/div><\/td>\n\n<td data-tableberg-row=\"0\" data-tableberg-col=\"1\" style=\"--tableberg-col-top-left: 8px; --tableberg-col-top-right: 8px; --tableberg-col-bottom-right: 8px; --tableberg-col-bottom-left: 8px; \" class=\"wp-block-tableberg-cell tableberg-v-align-center\"><div class=\"tableberg-cell-inner\" style=\"display: block; justify-content: center; flex-wrap: wrap; \">\n<p class=\"has-text-align-center\"><strong>Where can I get?<\/strong><\/p>\n<\/div><\/td>\n\n<td data-tableberg-row=\"0\" data-tableberg-col=\"2\" style=\"--tableberg-col-top-left: 8px; --tableberg-col-top-right: 8px; --tableberg-col-bottom-right: 8px; --tableberg-col-bottom-left: 8px; \" class=\"wp-block-tableberg-cell tableberg-v-align-center\"><div class=\"tableberg-cell-inner\" style=\"display: block; justify-content: center; flex-wrap: wrap; \">\n<p class=\"has-text-align-center\"><strong>Where is it?<\/strong><\/p>\n<\/div><\/td>\n\n<td data-tableberg-row=\"0\" data-tableberg-col=\"3\" style=\"--tableberg-col-border-top: 0px none ; --tableberg-col-border-right: 0px none ; --tableberg-col-border-bottom: 0px none ; --tableberg-col-border-left: 0px none ; --tableberg-col-top-left: 8px; --tableberg-col-top-right: 8px; --tableberg-col-bottom-right: 8px; --tableberg-col-bottom-left: 8px; \" class=\"wp-block-tableberg-cell tableberg-v-align-center\"><div class=\"tableberg-cell-inner\" style=\"display: block; justify-content: center; flex-wrap: wrap; \">\n<p class=\"has-text-align-center\"><strong>What is this discussion?<\/strong><\/p>\n<\/div><\/td>\n<\/tr><tr class=\"tableberg-even-row\" style=\"\">\n<td data-tableberg-row=\"1\" data-tableberg-col=\"0\" style=\"--tableberg-col-border-top: 0px none ; --tableberg-col-border-right: 0px none ; --tableberg-col-border-bottom: 0px none ; --tableberg-col-border-left: 0px none ; --tableberg-col-top-left: 8px; --tableberg-col-top-right: 8px; --tableberg-col-bottom-right: 8px; --tableberg-col-bottom-left: 8px; \" class=\"wp-block-tableberg-cell tableberg-v-align-center\"><div class=\"tableberg-cell-inner\" style=\"display: block; justify-content: center; flex-wrap: wrap; \">\n<p class=\"has-text-align-center has-base-color has-text-color has-link-color wp-elements-24970c9a0e41b5ec1a3f60718392df45\">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.<\/p>\n<\/div><\/td>\n\n<td data-tableberg-row=\"1\" data-tableberg-col=\"1\" style=\"--tableberg-col-top-left: 8px; --tableberg-col-top-right: 8px; --tableberg-col-bottom-right: 8px; --tableberg-col-bottom-left: 8px; \" class=\"wp-block-tableberg-cell tableberg-v-align-center\"><div class=\"tableberg-cell-inner\" style=\"display: block; justify-content: center; flex-wrap: wrap; \">\n<p class=\"has-text-align-center\">There are many variations of passages of are available, but the majority have suffered alteration in some form.<\/p>\n<\/div><\/td>\n\n<td data-tableberg-row=\"1\" data-tableberg-col=\"2\" style=\"--tableberg-col-top-left: 8px; --tableberg-col-top-right: 8px; --tableberg-col-bottom-right: 8px; --tableberg-col-bottom-left: 8px; \" class=\"wp-block-tableberg-cell tableberg-v-align-center\"><div class=\"tableberg-cell-inner\" style=\"display: block; justify-content: center; flex-wrap: wrap; \">\n<p class=\"has-text-align-center\">Contrary to popular belief, this is not simply random text. It has roots in a piece of classical Latin literature from 45 BC.<\/p>\n<\/div><\/td>\n\n<td data-tableberg-row=\"1\" data-tableberg-col=\"3\" style=\"--tableberg-col-border-top: 0px none ; --tableberg-col-border-right: 0px none ; --tableberg-col-border-bottom: 0px none ; --tableberg-col-border-left: 0px none ; --tableberg-col-top-left: 8px; --tableberg-col-top-right: 8px; --tableberg-col-bottom-right: 8px; --tableberg-col-bottom-left: 8px; \" class=\"wp-block-tableberg-cell tableberg-v-align-center\"><div class=\"tableberg-cell-inner\" style=\"display: block; justify-content: center; flex-wrap: wrap; \">\n<p class=\"has-text-align-center\">This is simply dummy text of the printing and typesetting industry. This has been the industry&#8217;s standard dummy text.<\/p>\n<\/div><\/td>\n<\/tr><\/tbody><\/table>\n\t\t\t<\/div>\n\t\t<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":10573,"template":"","meta":{"_eb_attr":"","footnotes":""},"pattern-categories":[133],"pattern-tags":[166,153,167,163,165],"class_list":["post-10572","table_pattern","type-table_pattern","status-publish","has-post-thumbnail","hentry","pattern_category-featured-box","pattern_tag-faq","pattern_tag-features","pattern_tag-highlights","pattern_tag-info-boxes","pattern_tag-services"],"tbpl_pattern_meta":{"description":"A colorful four-column layout with headings and supporting text. Ideal for showcasing features, FAQs, services, or highlights in a visually engaging way. Each column uses a different background color to create contrast and improve readability.","usage":"Copy and paste this pattern into your WordPress block editor. Replace the headings, colors, and text with your own content. You can also adjust the number of columns (2\u20134) depending on your needs.","preview_image":"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/09\/Four-Column-Info-Boxes-300x169.png","block_content":"<!-- wp:tableberg\/table {\"version\":\"0.5.1\",\"cols\":4,\"cells\":8,\"colStyles\":{\"0\":{\"background\":\"#3c82f6\",\"borderRadius\":{\"topLeft\":\"8px\",\"topRight\":\"8px\",\"bottomRight\":\"8px\",\"bottomLeft\":\"8px\"},\"border\":{\"width\":\"0px\",\"style\":\"none\"}},\"1\":{\"background\":\"#d5b89c\",\"borderRadius\":{\"topLeft\":\"8px\",\"topRight\":\"8px\",\"bottomRight\":\"8px\",\"bottomLeft\":\"8px\"}},\"2\":{\"background\":\"#cde7c5\",\"borderRadius\":{\"topLeft\":\"8px\",\"topRight\":\"8px\",\"bottomRight\":\"8px\",\"bottomLeft\":\"8px\"}},\"3\":{\"background\":\"#f3dce5\",\"border\":{\"width\":\"0px\",\"style\":\"none\"},\"borderRadius\":{\"topLeft\":\"8px\",\"topRight\":\"8px\",\"bottomRight\":\"8px\",\"bottomLeft\":\"8px\"}},\".\":[]},\"cellPadding\":{\"top\":\"var:preset|spacing|small\",\"bottom\":\"var:preset|spacing|small\"},\"cellSpacing\":{\"left\":\"8px\",\"right\":\"8px\"},\"enableInnerBorder\":false,\"responsive\":{\"last\":\"stack\",\"breakpoints\":{\"mobile\":{\"enabled\":true,\"headerAsCol\":false,\"maxWidth\":700,\"mode\":\"stack\",\"direction\":\"col\",\"stackCount\":1}}},\"innerBorderType\":\"col\"} -->\n<table class=\"wp-block-tableberg-table\"><!-- wp:tableberg\/cell {\"responsiveTarget\":\"#tableberg-18a6ade7-5bcf-4855-ada9-4d995c4363ce-0\"} -->\n<td class=\"wp-block-tableberg-cell\"><!-- wp:paragraph {\"align\":\"center\",\"style\":{\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|base\"}}}},\"textColor\":\"base\"} -->\n<p class=\"has-text-align-center has-base-color has-text-color has-link-color\"><strong>Why do we use it?<\/strong><\/p>\n<!-- \/wp:paragraph --><\/td>\n<!-- \/wp:tableberg\/cell -->\n\n<!-- wp:tableberg\/cell {\"col\":1,\"responsiveTarget\":\"#tableberg-18a6ade7-5bcf-4855-ada9-4d995c4363ce-2\"} -->\n<td class=\"wp-block-tableberg-cell\"><!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\"><strong>Where can I get?<\/strong><\/p>\n<!-- \/wp:paragraph --><\/td>\n<!-- \/wp:tableberg\/cell -->\n\n<!-- wp:tableberg\/cell {\"col\":2,\"responsiveTarget\":\"#tableberg-18a6ade7-5bcf-4855-ada9-4d995c4363ce-4\"} -->\n<td class=\"wp-block-tableberg-cell\"><!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\"><strong>Where is it?<\/strong><\/p>\n<!-- \/wp:paragraph --><\/td>\n<!-- \/wp:tableberg\/cell -->\n\n<!-- wp:tableberg\/cell {\"col\":3,\"responsiveTarget\":\"#tableberg-18a6ade7-5bcf-4855-ada9-4d995c4363ce-6\"} -->\n<td class=\"wp-block-tableberg-cell\"><!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\"><strong>What is this discussion?<\/strong><\/p>\n<!-- \/wp:paragraph --><\/td>\n<!-- \/wp:tableberg\/cell -->\n\n<!-- wp:tableberg\/cell {\"row\":1,\"responsiveTarget\":\"#tableberg-18a6ade7-5bcf-4855-ada9-4d995c4363ce-1\"} -->\n<td class=\"wp-block-tableberg-cell\"><!-- wp:paragraph {\"align\":\"center\",\"style\":{\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|base\"}}}},\"textColor\":\"base\"} -->\n<p class=\"has-text-align-center has-base-color has-text-color has-link-color\">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.<\/p>\n<!-- \/wp:paragraph --><\/td>\n<!-- \/wp:tableberg\/cell -->\n\n<!-- wp:tableberg\/cell {\"row\":1,\"col\":1,\"responsiveTarget\":\"#tableberg-18a6ade7-5bcf-4855-ada9-4d995c4363ce-3\"} -->\n<td class=\"wp-block-tableberg-cell\"><!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">There are many variations of passages of are available, but the majority have suffered alteration in some form.<\/p>\n<!-- \/wp:paragraph --><\/td>\n<!-- \/wp:tableberg\/cell -->\n\n<!-- wp:tableberg\/cell {\"row\":1,\"col\":2,\"responsiveTarget\":\"#tableberg-18a6ade7-5bcf-4855-ada9-4d995c4363ce-5\"} -->\n<td class=\"wp-block-tableberg-cell\"><!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">Contrary to popular belief, this is not simply random text. It has roots in a piece of classical Latin literature from 45 BC.<\/p>\n<!-- \/wp:paragraph --><\/td>\n<!-- \/wp:tableberg\/cell -->\n\n<!-- wp:tableberg\/cell {\"row\":1,\"col\":3,\"responsiveTarget\":\"#tableberg-18a6ade7-5bcf-4855-ada9-4d995c4363ce-7\"} -->\n<td class=\"wp-block-tableberg-cell\"><!-- wp:paragraph {\"align\":\"center\"} -->\n<p class=\"has-text-align-center\">This is simply dummy text of the printing and typesetting industry. This has been the industry's standard dummy text.<\/p>\n<!-- \/wp:paragraph --><\/td>\n<!-- \/wp:tableberg\/cell --><\/table>\n<!-- \/wp:tableberg\/table -->"},"tbpl_categories":[{"id":133,"name":"Bo\u00eete en vedette","slug":"featured-box","color":"#ff6b35"}],"tbpl_tags":[{"id":166,"name":"faq","slug":"faq"},{"id":153,"name":"caract\u00e9ristiques","slug":"caracteristiques"},{"id":167,"name":"highlights","slug":"highlights"},{"id":163,"name":"info boxes","slug":"info-boxes"},{"id":165,"name":"services","slug":"services"}],"_links":{"self":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/table-patterns\/10572","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/table-patterns"}],"about":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/types\/table_pattern"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":2,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/table-patterns\/10572\/revisions"}],"predecessor-version":[{"id":10575,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/table-patterns\/10572\/revisions\/10575"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media\/10573"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media?parent=10572"}],"wp:term":[{"taxonomy":"pattern_category","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/pattern-categories?post=10572"},{"taxonomy":"pattern_tag","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/pattern-tags?post=10572"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}