In my browser looks ok, but when I move it to Gmail my #Container move under "K" letter in "Kamala" word inside my background image, and the other problem is when i send it as a e-mail, on the recieved e-mail everything in #Container are already under my background image.If it's not possible with divs i thi i should go back to tables, because i have so many problems now. I know that mistake is with me i want to learn, but from 2 days cannot make it the way it should be.\[code\] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css">div#Container {position: absolute;left: 9px;top: 15px; } div#Room {margin-left: 83.5%;margin-top: 11%;width: 625px; } #Room span {font-family: Times New Roman, Times, serif;font-weight: bold;text-align: left;font-size: 23px;color: #522405; } #D { padding-left: 70px; } #GD { padding-left: 103px; } #GPV { padding-left: 53px; } div#Content {margin-left: 83.5%;margin-top: 1%;width: 625px; } #Right {position: absolute;left: 1152px;top: 222px; } img.Spacer {margin-left: 10px; } div.content {font-family: Arial, Helvetica, sans-serif;text-align: left;color: black;font-size: 17px;font-weight: bold; } .BP {vertical-align: text-top;margin-top: 10px;margin-left: 245px; } .table {vertical-align: text-top;font-family: Arial, Helvetica, sans-serif;font-size: 20px;text-align: center;color: #002b55;margin-left: 83.5%; } .TD {margin-left: 30px; } .adress {font-family: Times New Roman, Times, serif;font-size: 10px;text-align: center;font-weight: bold;color: #100073; } .OOT {font-family: Arial, Helvetica, sans-serif;font-size: 13px;font-weight: bold;color: #100073;text-align:center; } .res {vertical-align: top;padding-left: 25px; }</style></head><body><div align="center"><img style="position: relative;" src="http://i1300.photobucket.com/albums/ag93/dobriyan/E-mail%20-%20Ayara%20Kamala/BK_zpsa93ab347.png" alt="Background" /></div><div id="Container"><div id="Room" aling="left"> <a href="http://bit.ly/XSyPG5" title="Deluxe" target="_blank" > <img align="left" src="http://i1300.photobucket.com/albums/ag93/dobriyan/E-mail%20-%20Ayara%20Kamala/D_zpsf4ea5de8.jpg" border="0px" alt="Deluxe" /> </a> <a href="http://bit.ly/XSyPG5" title="Grand Deluxe" target="_blank" > <img align="left" class="Spacer" src="http://i1300.photobucket.com/albums/ag93/dobriyan/E-mail%20-%20Ayara%20Kamala/GD_zpse78278b7.jpg" border="0px" alt="Grand Deluxe" /> </a> <a href="http://bit.ly/XSyPG5" title="Grand Pool Villa" target="_blank" > <img align="left" class="Spacer" src="http://i1300.photobucket.com/albums/ag93/dobriyan/E-mail%20-%20Ayara%20Kamala/GPV_zpsb381cd33.jpg" border="0px" alt="Grand Pool Villa" /> </a> <br /> <a href="http://bit.ly/XSyPG5" title="Deluxe" target="_blank" style="text-decoration: none;"><span id="D">Deluxe</span></a> <a href="http://bit.ly/XSyPG5" title="Grand Deluxe" target="_blank" style="text-decoration: none;"><span id="GD">Grand Deluxe</span></a> <a href="http://bit.ly/XSyPG5" title="Grand Pool Villa" target="_blank" style="text-decoration: none;"><span id="GPV">Grand Pool Villa</span></a> </div> <div align="left" id="Content" class="content">Situated on a hill, Ayara Kamala offers a beautiful garden and ocean view rooms. The place of the hotel provides quiet, calm and romantic holiday away from all other hotels on Kamala Beach.<br /><br />Big size of rooms, king size beds and impressive bathrooms, are making Ayara Kamala perfect selection for couples who are looking for privacy and relaxing holiday. </div><table align="left" class="table" style="border-collapse: separate; border-spacing: 1px;" width="625" border="0"> <tr> <td align="right" style="padding-left: 20px;" width="302"><a href="http://bit.ly/XSyPG5" title="Book Now !"><img src="http://i1300.photobucket.com/albums/ag93/dobriyan/E-mail%20-%20Ayara%20Kamala/BP_zps15c948a1.png" border="0px" alt="Best Rate"/></a></td> <td width="321" valign="top"><table class="TD" style="border-collapse: separate; border-spacing: 0px;" border="0px"> <tr> <td height="30" class="res" align="center"><a href="http://bit.ly/XSyPG5" title="B2B Online Booking"><span>www.b2b.onlyonetour.com</span></a></td> </tr> <tr> <td class="res" height="30" align="center"><span>Tel : (66) 02 - 688 - 8883 </span> </td></tr><tr><td class="res" height="30" align="center"><a href="mailto:[email protected]" title="E-mail Reservation"><span>[email protected]</span></a></td></tr></table></td></tr></table><div align="center" id="Right"><a style="text-decoration: none;" href="http://bit.ly/XSyPG5" title="Only One Tour & Travel Group Co., Ltd." target="_blank"><img width="149px" height="90px" src="http://i1300.photobucket.com/albums/ag93/dobriyan/E-mail%20-%20Ayara%20Kamala/logoOOT_zps24c21653.png" border="0px" alt="Logo" /></a><a style="text-decoration: none;" href="http://bit.ly/XSyPG5" title="Only One Tour & Travel Group Co., Ltd." target="_blank"><span class="OOT">Only One Tour & Travel<br />Group Co., Ltd.</span></a><br /><br /><a style="text-decoration: none;" href="http://on.fb.me/XXqq56" title="Only One Tour Facebook Page" target="_blank"> <img src="http://i1300.photobucket.com/albums/ag93/dobriyan/E-mail%20-%20Ayara%20Kamala/facebook-logo-png-format-i18_zps83b6a9aa.png" width="145px" height="50px" border="0px" alt="FB"/></a><br /><br /> <span class="adress">2128/9-11 Charoenkung Rd.,</span><br /> <span class="adress">Watprayakrai, Bangkorleam,</span><br /> <span class="adress">10120 Bangkok, Thailand.</span><br /><a class="adress" href="http://bit.ly/XSyPG5" target="_blank">www.b2b.onlyonetour.com</a><br /><a class="adress" href="http://on.fb.me/XXqq56" target="_blank">www.onlyonetour.com (offline)</a> </div></div></body> </html>\[/code\]
Need help correcting code for HTML newsletter which will be used in Gmail
- Thread starter djtrone
- Start date