Menu icon Foundation
Full (fluid) width header or footer - Questions

I'm working with the example on this page under, Full (fluid) width header or footer

Two things are curious to me. First is this bit of css:

 

 .wrapper.secondary {
    background: #f3f3f3;
  }

I don't see a secondary class being used in the example, or in any of the created HTML, nor do I understand what this specific background color is for, as the rest of the header/footer is a different color. Here's the source I'm seeing:

 

<wrapper class="header" bgcolor="#8a8a8a">
  <container>
    <row class="collapse">
      <columns small="6" valign="middle">
        <img src="http://placehold.it/200x50/663399">
      </columns>
      <columns small="6" valign="middle">
        <p class="text-right">BASIC</p>
      </columns>
    </row>
  </container>
</wrapper>

Secondly, the HTML has background color made in the HTML code:

bgcolor="#8a8a8a"

Is this explicitly needed?

I took both out in this codepen, and the results are similar from when they're inserted. Is there a email client that relies on one/both of these pieces of code, or are these snippets superfluous?

http://codepen.io/leaddadaist/pen/qqXyMo

emailheaderfoothtmlcss

I'm working with the example on this page under, Full (fluid) width header or footer

Two things are curious to me. First is this bit of css:

 

 .wrapper.secondary {
    background: #f3f3f3;
  }

I don't see a secondary class being used in the example, or in any of the created HTML, nor do I understand what this specific background color is for, as the rest of the header/footer is a different color. Here's the source I'm seeing:

 

<wrapper class="header" bgcolor="#8a8a8a">
  <container>
    <row class="collapse">
      <columns small="6" valign="middle">
        <img src="http://placehold.it/200x50/663399">
      </columns>
      <columns small="6" valign="middle">
        <p class="text-right">BASIC</p>
      </columns>
    </row>
  </container>
</wrapper>

Secondly, the HTML has background color made in the HTML code:

bgcolor="#8a8a8a"

Is this explicitly needed?

I took both out in this codepen, and the results are similar from when they're inserted. Is there a email client that relies on one/both of these pieces of code, or are these snippets superfluous?

http://codepen.io/leaddadaist/pen/qqXyMo

Rafi Benkual almost 3 years ago

You probably dont need the secondary class, it may be left over from an earlier example.

You do need the bdcolor attribute for Outlook 2007, 10, 13 or it tends to ignore background property.