Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    May 2013
    Location
    Brooklyn, NY
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Div problem in Google Chrome

    Hi all! I have designed this very simple html e-mail and have been testing it in Safari, and it looked fine!

    However when I open it in Chrome, all hell breaks loose.
    HELP!

    When I used the decoder for chrome, it only had an issue with my #wrapper div and could not correctly define my dimensions... Even though I have defined them.

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>KOHLER BOLD REWARDS</title>
    <style type="text/css">

    .Grey-body {
    color: #CCC;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    }
    body {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1em;
    line-height: 1.3em;

    }
    h1 {
    vertical-align:top;
    line-height: 1em;
    }
    h2 {
    line-height: 1.2em;
    color:#1D124F;
    }
    #wrapper {
    margin: 0 auto;
    position: center;
    width: 600 px;
    height: 830 px;
    overflow:hidden;
    background-color:#FFF
    }
    #typeL{
    margin: 0 auto;
    float: left;
    padding-top: 20px;
    padding-left: 40px;
    width: 500px;
    height: 170px;
    background-color:#FFF;
    border: 0px;
    }
    #typeR{
    margin: 0 auto;
    float: left;
    padding-top: 10px;
    padding-left: 40px;
    padding-bottom: 10px;
    width: 500px;
    height: 250px;
    background-color:#FFF;
    border: 0px;
    }
    #Columntype{
    float: right;
    width:350px;
    }

    #feedbackimage{
    margin: 0 auto;
    padding-top: 10px;
    padding-left: 30px;
    padding-right: 30px;
    width: 540px;
    height: 60px;
    background-color:#FFF;
    border: 0px;
    }
    #feedbacktype{
    margin: 0 auto;
    float: right;
    width: 445px;
    height: 70px;
    background-color:#FFF;
    border: 0px;
    }
    a:link {
    color: #C3C;
    }
    a:visited {
    color: #69F;
    }
    -->
    </style>
    </head>
    <body bgcolor="#1e1e32" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <p><br>
    <div align="center" class="Grey-body"> If you have trouble viewing this email, please <a href="BoldRewards_MothersDay-email.html">click here</a> to view online. </div>
    </p>
    <div id="wrapper">

    <img src="images/BoldRewards2.jpg" alt="Bold Rewards" width="600" height="250" usemap="#Map" border="0" />
    <map name="Map">
    <area shape="rect" coords="11,9,184,82" href="https://www.kohlerpromotions.com/">
    <area shape="rect" coords="502,220,596,243" href="http://www.egr-kohler.com/catalog/?first=1">
    </map>
    <div id="typeL">
    <img src="images/shoppingcart.jpg" width="120" height="100" alt="Market for Mom" />
    <div id="Columntype">
    <h2>Use your rewards <br>
    + show her you care!</h2>
    <p><b>Mother’s Day</b> is nearly here! <br>Take advantage of these <br>excellent gift options!
    </P>
    </div>
    </div>

    <div id="typeR"><a href="https://www.kohlerpromotions.com/Academy/CourseList"><img src="images/academy_dblue.jpg" width="120" padding-left= height="100" longdesc="https://www.kohlerpromotions.com/Academy/CourseList"/></a>
    <div id="Columntype">
    <h2>The Academy – EXPANDED! </h2>
    <p><b>New</b> Professional Selling Skills: <br>
    Quick videos to seal your sale! <br> <br>
    <b>New</b> Supplemental Learning: <br>
    More quizzes with excellent tips on our products! <br><br>
    <b>Coming Soon</b> May Learn & Earn: <br>
    You’ll love this next one! </p>
    </div>
    </div>

    <div id="feedbackimage">
    <hr align="center" width="530">
    <img src="images/feedback_dblu.jpg" width="66" height="75" />
    <div id="feedbacktype"><p> <b>Feedback</b> – we love to hear from you! <br>
    Tell us your thoughts, suggestions and comments. <a href="mailto:rewards@kohlerpromotions.com">rewards@kohlerpromotions.com</a> </p>
    </div>
    </div>

    </div>

    </body>
    </html>

  • #2
    Regular Coder nomanic's Avatar
    Join Date
    Feb 2009
    Location
    United Kingdom
    Posts
    255
    Thanks
    9
    Thanked 33 Times in 33 Posts
    I was told to use tables in emails? dont know why, if you look at groupon and kgbdeals and all these html emails, they all use tables it seems
    <DmncAtrny> I will write on a huge cement block "BY ACCEPTING THIS BRICK THROUGH YOUR WINDOW, YOU ACCEPT IT AS IS AND AGREE TO MY DISCLAIMER OF ALL WARRANTIES, EXPRESS OR IMPLIED, AS WELL AS DISCLAIMERS OF ALL LIABILITY, DIRECT, INDIRECT, CONSEQUENTIAL OR INCIDENTAL, THAT MAY ARISE FROM THE INSTALLATION OF THIS BRICK INTO YOUR BUILDING."
    <DmncAtrny> And then hurl it through the window of a Sony officer
    <DmncAtrny> and run like hell

    Portfolio, Tutorials - http://www.nomanic.biz/


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •