0 Replies Latest reply on Oct 16, 2018 9:10 AM by MK McNerney

    Email no responsive to mobile phone

    MK McNerney

      Hi, so I am at a loss as to why my header and footer are not responding to mobile screen sizes.

       

      Can someone look at this code and let me know what I am doing wrong...

       

          <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

          <meta name="viewport" content="width=device-width, initial-scale=1" />

          <meta name="robots" content="noindex,nofollow" />

          <meta http-equiv="X-UA-Compatible" content="IE=edge" />

          <link href="https://fonts.googleapis.com/css?family=Raleway:300,400,700" rel="stylesheet" type="text/css" />

          <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet" type="text/css" />

          <!--[if mso]>

      <style type='text/css'>

      .primary-font {

      font-family: Arial, sans-serif !important;

      }

      </style>

      <![endif]-->

          <!--[if mso]>

      <style type='text/css'>

      .secondary-font {

      font-family: Arial, sans-serif !important;

      }

      </style>

      <![endif]-->

          <style> @media only screen and (max-width: 600px) {table#boxing { width: 100% !important } .responsive {

          width: 100%;

          height: auto;

      } } </style>

          <!--[if gte mso 9]>

            <style type="text/css">

             #hero .table3-3{

           width: 100% !important;

             }

      </style>

      <![endif]-->

          <!--[if gte mso 9]>

            <style type="text/css">

             #hero .table1-2{

           width: 100% !important;

             }

      </style>

      <![endif]-->

          <!--[if gte mso 9]>

            <style type="text/css">

             #hero .table1-3{

           width: 100% !important;

             }

            </style>

        <![endif]-->

          <!--[if gte mso 9]>

            <style type="text/css">

             #hero .table1-4{

           width: 100% !important;

             }

            </style>

        <![endif]-->

          <!--[if gte mso 9]>

            <style type="text/css">

             #hero .table2-3{

           width: 100% !important;

             }

            </style>

        <![endif]-->

          <style media="all"> @-ms-viewport { width: device-width; } (img {max-width: 100%;} .responsive {

          width: 100%;

          height: auto;} </style>

          <style media="all"> @media only screen and (max-width: 640px) {.mktoVideoThumbnail { width: 100% !important; height: auto !important; max-height: inherit !important; min-height: inherit !important } body { width: auto !important } table.table600 { width: 450px !important } table.table-inner { width: 86% !important } table.table1-2 { width: 47% !important; clear: both } table.table1-3 { width: 29.4% !important } table.table1-4 { width: 100% !important; text-align: left !important } table.table2-3 { width: 64% !important; text-align: center !important } table.table3-3 { width: 100% !important; text-align: center !important; clear: both } table.footer-logo { width: 10% !important; text-align: right !important } td.outer { min-width: 0 !important } td.stack { padding-bottom: 40px !important } .stack-tablet { padding-bottom: 20px !important; overflow: visible !important; float: none !important; mso-hide: none !important; display: block !important } img.mobile-img { width: 100% !important } td.center-tablet { text-align: center !important } td.hide-tablet { display: none !important } table.footer-column { width: 47% !important; text-align: left !important } .m_two-articles .table1-2 { width: 100% !important } .m_two-articles .photo img { width: 100% !important } .m_two-articles .stack-tablet td { height: 60px !important } .m_free-image img { width: 100% !important } } @media only screen and (max-width: 479px) {body { width: auto !important } table.table600 { width: 290px !important } table.table-inner { width: 80% !important; float: none !important } table.table1-2 { width: 100% !important; clear: both } table.table1-3 { width: 100% !important; clear: both } table.table1-4 { width: 100% !important; text-align: center !important } table.table2-3 { width: 100% !important; text-align: center !important } table.table3-3 { width: 100% !important; text-align: center !important; clear: both } table.footer-logo { width: 60% !important; text-align: center !important } td.outer { min-width: 0 !important } td.td3-1 { width: 60% !important; text-align: center !important } .stack-smartphone { padding-bottom: 20px !important; overflow: nonvisible !important; float: none !important; display: block !important; mso-hide: none !important } td.center-smartphone { text-align: center !important } img.mobile-img { width: 100% !important } td.center-tablet { text-align: center !important } td.hide-smartphone { display: none !important } table.footer-column { width: 100% !important; text-align: center !important } .m_free-image img { width: 100% !important } .m_hr .table-inner { width: 100% !important } .responsive {

          width: 100%;

          height: auto;

          }} </style>