notice: please create a custom view template for the blocks class view-blocks.html
3 Box Section Wrap - Foundation
3 boxes responsive in foundation, using large-4 cell.
tags
foundation, 3 box, 3 columns
html
Box Section Title
css
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&display=swap'); .boxsection-wrap { margin:0 auto; width:100%; max-width:1200px; padding:50px 0; } .boxsection {} .boxsection-title {} .boxsection-box-link {} .boxsection-box-link a { } .boxsection-box-text { margin-bottom:10px; } .boxsection-box-title { font-weight:bold; font-family:"Poppins", sans-serif; margin-bottom:10px; } .boxsection-box-image { height:200px; width:100%; margin-bottom:10px; /* background:url(https://unsplash.it/900/700) center no-repeat; */ } .bsbi1 .boxsection-box-image{ background:url(https://unsplash.it/900/700) center no-repeat; background-size:cover; } .bsbi2 .boxsection-box-image{ background:url(https://unsplash.it/900/700) center no-repeat; background-size:cover; } .bsbi3 .boxsection-box-image{ background:url(https://unsplash.it/900/700) center no-repeat; background-size:cover; }
scripts
source_url
https://codepen.io/vanderzone/pen/VwyraOz
framework
foundation
version
6.7.3
block_type
boxes
preview_image
https://i.imgur.com/QgAikIM.png
id: 2
uid: 8JS2U
insdate: 2022-04-02 03:41:00
title: 3 Box Section Wrap - Foundation
additional:
3 boxes responsive in foundation, using large-4 cell.
category: foundation
tags: foundation, 3 box, 3 columns
html:
Box Section Title
css: @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&display=swap'); .boxsection-wrap { margin:0 auto; width:100%; max-width:1200px; padding:50px 0; } .boxsection {} .boxsection-title {} .boxsection-box-link {} .boxsection-box-link a { } .boxsection-box-text { margin-bottom:10px; } .boxsection-box-title { font-weight:bold; font-family:"Poppins", sans-serif; margin-bottom:10px; } .boxsection-box-image { height:200px; width:100%; margin-bottom:10px; /* background:url(https://unsplash.it/900/700) center no-repeat; */ } .bsbi1 .boxsection-box-image{ background:url(https://unsplash.it/900/700) center no-repeat; background-size:cover; } .bsbi2 .boxsection-box-image{ background:url(https://unsplash.it/900/700) center no-repeat; background-size:cover; } .bsbi3 .boxsection-box-image{ background:url(https://unsplash.it/900/700) center no-repeat; background-size:cover; }
scripts:
javascript:
php:
source_url: https://codepen.io/vanderzone/pen/VwyraOz
framework: foundation
version: 6.7.3
block_type: boxes
preview_image: https://i.imgur.com/QgAikIM.png