Skip to content

custom padding added to column is incorrectly manipulated by foundation #67

@georgenicholas

Description

@georgenicholas

How can we reproduce this bug?
HTML:

<span class="new-conversation">
  <row>
    <columns class="card">
      <row>
        <!-- <columns small="1"></columns> -->
        <columns class="message-content" style="padding-left: 20px;\">
          <span>
          <%= "Hi #{@recipient.first_name}," %>

          <br /><br />

          <%= @body %>

          <br /><br />

          <button href="<%= @link %>" class="radius">
            <%= @link_text %>
          </button>
        </span>
        </columns>
      </row>
    </columns>
  </row>
</span>

SCSS:

.new-conversation {
  .message-content {
    padding: 1em;
  }
}

What did you expect to happen?
For there to be padding: 1em on th class="message-content"

What happened instead?

    width: 100%;
    color: #0a0a0a;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: normal;
    line-height: 1.3;
    font-size: 16px;
    margin: 0 auto;
    padding: 1em 0;

It adds a 0 after, which is a problem. I've tried multiple different combinations of padding just for fun, and they are always messed with and never come out as they were written in the scss file.

What email clients does this happen in?
rails 5.1 email preview, chrome browser.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions