{"id":24025,"date":"2020-12-22T06:36:59","date_gmt":"2020-12-22T06:36:59","guid":{"rendered":"https:\/\/webartdevelopers.com\/blog\/?p=24025"},"modified":"2020-12-22T06:41:27","modified_gmt":"2020-12-22T06:41:27","slug":"masonry-dynamic-column-flexbox","status":"publish","type":"post","link":"https:\/\/webartdevelopers.com\/blog\/masonry-dynamic-column-flexbox\/","title":{"rendered":"MASONRY DYNAMIC COLUMN FLEXBOX"},"content":{"rendered":"\n<h4 class=\"wp-block-heading\"><strong><span style=\"text-decoration: underline;\"><em>Author:<\/em><\/span><\/strong><\/h4>\n\n\n\n<ul><li>Chris Weissenberger<\/li><li>November 15, 2019<\/li><\/ul>\n\n\n\n<h4 class=\"wp-block-heading\"><strong><span style=\"text-decoration: underline;\"><em>Made with:<\/em><\/span><\/strong><\/h4>\n\n\n\n<ul><li>HTML \/ CSS (SCSS) \/ JS<\/li><\/ul>\n\n\n\n<h4 class=\"wp-block-heading\"><strong><span style=\"text-decoration: underline;\"><em>About the code:<\/em><\/span><\/strong><\/h4>\n\n\n\n<p>This is an amazing and wonderful masonry layout which is best suited for content without long text or with no text at all (such as images) as long text will not wrap, but instead, squeeze its container against the other columns.<\/p>\n\n\n\n<p><strong><em>Compatible browsers:<\/em><\/strong> Chrome, Edge, Firefox, Opera, Safari<\/p>\n\n\n\n<p><strong><em>Responsive:<\/em><\/strong> Yes<\/p>\n\n\n\n<p><strong><em>Dependencies:<\/em><\/strong> &#8211;<\/p>\n\n\n<a href=\"https:\/\/codepen.io\/CAWeissen\/share\/zip\/xxxQpba\" class=\"su-button su-button-style-default\" style=\"color:#ffffff;background-color:#000000;border-color:#000000;border-radius:40px\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color:#ffffff;padding:0px 20px;font-size:16px;line-height:32px;border-color:#4d4d4d;border-radius:40px;text-shadow:none\"> Download<\/span><\/a>\n\n\n<a href=\"https:\/\/codepen.io\/CAWeissen\/pen\/xxxQpba\" class=\"su-button su-button-style-default\" style=\"color:#ffffff;background-color:#000000;border-color:#000000;border-radius:40px\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"color:#ffffff;padding:0px 20px;font-size:16px;line-height:32px;border-color:#4d4d4d;border-radius:40px;text-shadow:none\"> Demo and Code<\/span><\/a>\n<!-- AddThis Advanced Settings generic via filter on the_content -->","protected":false},"excerpt":{"rendered":"Author: Chris Weissenberger November 15, 2019 Made with: HTML \/ CSS (SCSS) \/ JS About the code: This is an amazing and wonderful masonry layout which is best suited for content without long text or with no text at all (such as images) as long text will not wrap, but instead, squeeze its container against the other columns. Compatible browsers: Chrome, Edge, Firefox, Opera, Safari Responsive: Yes Dependencies: &#8211;<!-- AddThis Advanced Settings generic via filter on get_the_excerpt -->","protected":false},"author":1,"featured_media":24026,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4752],"tags":[20,4763,5613,269,6683,6682],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/posts\/24025"}],"collection":[{"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/comments?post=24025"}],"version-history":[{"count":1,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/posts\/24025\/revisions"}],"predecessor-version":[{"id":24027,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/posts\/24025\/revisions\/24027"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/media\/24026"}],"wp:attachment":[{"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/media?parent=24025"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/categories?post=24025"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webartdevelopers.com\/blog\/wp-json\/wp\/v2\/tags?post=24025"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}