{
  "Status": true,
  "Message": "",
  "Response": {
    "post": {
      "postuid": "e7493c9b-cdaa-4bbb-a534-ff1f318e574c",
      "tenantuid": "d8b744fc-2e70-4089-bb80-dd1d08f6c7b2",
      "projectuid": "239698c5-f7eb-4574-8cc8-c6568f08b3a0",
      "title": "3 Column Container",
      "slug": "article/3-column-widget",
      "html": "\u003Cp\u003EThe Three Column Container widget is a very flexible layout widget you can use to achieve various formatting options in the body of your email. It\u0027s is fully mobile friendly and can either stack columns in mobile devices or not stack columns in mobile.\u003C/p\u003E\u003Ch2 id=\u0022using_the_three_column_container\u0022\u003EUsing the Three Column Container\u003C/h2\u003E\u003Cp\u003EWhen the Three Column Container is added to an email, it is initially configured to show three columns each allowed 33% of the display area. It is initially configured with a pre-set spacing of 5px between the columns:\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-width=\u00221026\u0022 data-height=\u0022294\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/46e45ec2-303e-4334-b9d1-3a3a4c1a50d8.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cp\u003EUsing the options in the Design section, these options can be configured.\u003C/p\u003E\u003Ch2 id=\u0022setting_space_between_columns\u0022\u003ESetting Space Between Columns\u003C/h2\u003E\u003Cp\u003EUsing the \u003Ccode class=\u0022inline-code\u0022\u003ESpace between columns\u003C/code\u003E slider you can control the exact spacing between columns.\u003C/p\u003E\u003Cp\u003EIt\u0027s recommended to use spacing between column instead of setting padding on items within the columns. When columns stack on mobile the space between columns is eliminated. If padding is used on an element the padding is still shown on mobile.\u003C/p\u003E\u003Ch2 id=\u0022setting_vertical_alignment\u0022\u003ESetting Vertical Alignment\u003C/h2\u003E\u003Cp\u003EThe \u003Ccode class=\u0022inline-code\u0022\u003EVertical Alignment\u003C/code\u003E option enables you to control how the items in each column align vertically. The default is for items to align to the top, but you may want to use other alignment options depending on the desired layout.\u003C/p\u003E\u003Ch2 id=\u0022mobile_device_behavior\u0022\u003EMobile Device Behavior\u003C/h2\u003E\u003Cp\u003EThe default behavior is for columns is to stack vertically on mobile. This simply means that a two column layout will convert to a one column layout with the left most item shown on top.\u003C/p\u003E\u003Cp\u003EHowever, for certain designs, column stacking is unnecessary. To prevent stacking on mobile simply toggle the \u003Ccode class=\u0022inline-code\u0022\u003EDo Not Stack Column\u003C/code\u003E option for On Mobile Devices.\u003C/p\u003E",
      "publish_status": 0,
      "post_type": "Article",
      "featured_image_updating": false,
      "meta_description": "Create responsive email layouts with the flexible Three Column Container widget. Customize spacing, alignment, and mobile stacking options easily.",
      "display_toc": true,
      "has_workingcopy": false,
      "allow_indexing": true,
      "sort_order": 15,
      "total_views": 634,
      "date_published": "2025-06-04T14:46:35.463",
      "date_updated": "2025-06-04T14:46:35.927",
      "date_created": "2025-06-04T14:41:46.977"
    }
  }
}