473,237 Members | 1,085 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,237 software developers and data experts.

internet explorer image placement issue but fine in mozzila

For some unknown reason ie is placing images I have in a div in a weird way. One image is overlapping another but this problem is not occuring in mozilla. I have looked at my code over and over again but cant seem to find out what the problem is. I think this could be fixed with a i.e hack??? please advise

the problem of the overlapping image is occuring in imagerow2 div on line 56. please see my code below

here is my html

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.  
  4. <head>
  5.  
  6. <title>Ebay listing template</title>
  7. <link rel="stylesheet" type="text/css" media="screen" href="styles/stylesheet.css" />
  8. </head>
  9.  
  10. <body>
  11. <div id="body">
  12.   <div id="container"> <!--START CONTAINER-->
  13.     <div id="header"> <!--START HEADER-->
  14.     </div> <!--END HEADER-->
  15.     <div id="title">Unboxed Microsoft Xbox 360 Core Version FAULTY Red Rings Of Death, Power Fault - SPARES <!--START TITLE-->
  16.     </div> <!--END TITLE-->
  17.     <div id="main"> <!--START MAIN-->
  18.       <div id="contenth1">Description <!--START CONTENTH1-->
  19.       </div> <!--END CONTENTH1-->
  20.       <div id="content1"> <!--START CONTENT1-->
  21.       <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01762.jpg" target="_blank"> 
  22.       <img src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01762.jpg" height="90" width="120" 
  23.       alt="Gallery Image" title="Click for larger version" align="right" style="margin:10px"/></a>
  24.         <span>For sale is an unboxed Microsoft Xbox 360 Core edition game console. There's no box, component/power cable, hard drive, controller or or any other accessories!<br />
  25.         <strong>Only console is provided! </strong></span><br /><br />
  26.         <span> This has suffered from the red ring of death and also has a power supply problem as sometimes the console turns on but sometimes does not.
  27.         Console has been opened before so warranty is void. There's no obvious damage or marks to the console. This would be ideal as 
  28.         spares or if you know how to fix this machine you can grab a bargain. <strong>No returns provided!</strong></span><br /><br />
  29.         <span> If you have any questions please do not hesitate to <a href="mailto:pro.jdm@ntlworld.com?subject=Ebay%20Auction">Contact 
  30.         me!</a> </span>
  31.       </div> <!--END CONTENT1-->
  32.       <div id="contenth2">Pictures <!--START CONTENTH2-->
  33.       </div> <!--END CONTENT2-->
  34.       <div id="content2"> <!--START CONTENT2-->
  35.         <span> Click on an image thumbnail below to view a larger version.</span><br /><br />
  36.         <div id="imagerow1"> <!--START IMAGEROW1-->
  37.         <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01762.jpg" target="_blank"> 
  38.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01762.jpg" height="90" width="120" 
  39.         alt="Gallery Image" title="Click for larger version" /></a> 
  40.         <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01757.jpg" target="_blank"> 
  41.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01757.jpg" height="90" width="120" 
  42.         alt="Image 2" title="Click for larger version"/>
  43.         </a> <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01758.jpg" target="_blank"> 
  44.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01758.jpg" height="90" width="120" 
  45.         alt="Image 3" title="Click for larger version"/></a> 
  46.         <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01759.jpg" target="_blank"> 
  47.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01759.jpg" height="90" width="120" 
  48.         alt="Image 4" title="Click for larger version"/></a> 
  49.         <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01760.jpg" target="_blank"> 
  50.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01760.jpg" height="90" width="120" 
  51.         alt="Image 5" title="Click for larger version"/></a> 
  52.         <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01761.jpg" target="_blank"> 
  53.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/xboxcorefaulty23022009/DSC01761.jpg" height="90" width="120" 
  54.         alt="Image 6" title="Click for larger version"/></a> 
  55.         </div> <!--END IMAGEROW1-->
  56.         <div id="imagerow2"> <!--START IMAGEROW2-->
  57.         <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/no-image.gif" target="_blank"> 
  58.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/no-image.gif" height="90" width="120" 
  59.         alt="Image 7" title="Click for larger version"/></a> 
  60.         <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/no-image.gif" target="_blank"> 
  61.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/no-image.gif" height="90" width="120" 
  62.         alt="Image 8" title="Click for larger version"/></a>
  63.         <a href="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/no-image.gif" target="_blank"> 
  64.         <img style="float:left; margin:5px; padding:0" src="http://i327.photobucket.com/albums/k442/ej2_sleeper/ebay/no-image.gif" height="90" width="120" 
  65.         alt="Image 9" title="Click for larger version"/></a> 
  66.           </div> <!--END IMAGEROW2-->
  67.       </div> <!--END CONTENT2-->
  68.     </div> <!--END MAIN-->
  69.     <div id="sidesection"> <!--START SIDESECTION-->
  70.       <div id="contenth3">Payment &amp; Contact Info <!--START CONTENTH3-->
  71.       </div> <!--END CONTENTH3-->
  72.       <div id="content3"> <!--START CONTENT3-->
  73.         <span>Payment must be made within 48-72 hours. Payment can be made via Paypal, Personal Cheque or a bank transfer. <br /><br />
  74.         I can be contacted directly via email at <br /><br />
  75.         <a href="mailto:pro.jdm@ntlworld.com?subject=Ebay%20Auction">pro.jdm@ntlworld.com</a><br /><br />
  76.  
  77.         Once paypal payment is received or a cheque/bank transfer has cleared the item will be dispatched within 48 hours. </span>
  78.         <br /><br />
  79.         <span><a href="mailto:pro.jdm@ntlworld.com?subject=Ebay%20Auction">Click here to email me</a><br />
  80.         <a href="http://shop.ebay.co.uk/merchant/pro.jdm_W0QQ_nkwZQQ_armrsZ1QQ_fromZQQ_mdoZ">View my other auctions</a><br />
  81.         <a href=
  82.         "http://feedback.ebay.co.uk/ws/eBayISAPI.dll?ViewFeedback2&userid=pro.jdm&ftab=AllFeedback">
  83.         Read my feedback reviews</a></span>
  84.       </div> <!--END CONTENT3-->
  85.       <div id="contenth4">Shipping <!--START CONTENTH4-->
  86.       </div> <!--END CONTENTH4-->
  87.       <div id="content4"> <!--START CONTENTH4-->
  88.         <span> Domestic packages are shipped via Royal mail. Delivery details can be found at the bottom of each auction page. <br />
  89.         <br />
  90.         <strong>International shipping is not offered.</strong></span><br /><br />
  91.         <span> Shipping fees include costs of packaging (bubble wrap, brown wrapping paper, cardboard box, etc).</span>
  92.       </div> <!--END CONTENTH4-->
  93.     </div> <!--END SIDESECTION-->
  94.     <div id="footer"> <!--START FOOTER-->
  95.       <div id="leftcontent">Copyright &copy; 2008 Pro JDM <!--START LEFTCONTENT-->
  96.       </div> <!--END LEFTCONTENT-->
  97.       <div id="rightcontent">Powered by Pro JDM <!--START RIGHTCONTENT-->
  98.       </div> <!--END RIGHTCONTENT-->
  99.     </div> <!--END FOOTER-->
  100.   </div> <!--END CONTAINER-->
  101. </div> <!--END BODY-->
  102.  
  103. </body>
  104. </html>
  105.  
here is my css

Expand|Select|Wrap|Line Numbers
  1. #body { 
  2.     padding-top: 25px;
  3.     padding-bottom: 25px;
  4.     text-align:center;
  5.     background-color: black
  6. }
  7.  
  8. #container {
  9.     height: 946px;
  10.     width: 1000px;
  11.     margin:auto;
  12.     text-align: center;
  13.     border-style:solid;
  14.     border-color:white;
  15.     border-width:1px;
  16.     background-color: black
  17. }
  18. #header {
  19.     height: 289px;
  20.     width: 1000px;
  21.     background-image: url(../ebayimages/header.jpg);
  22.     background-repeat: repeat-x
  23. }
  24. #title {
  25.     height:43px;
  26.     width:1000px;
  27.     padding-top: 12px;
  28.     background-image: url(../ebayimages/gradient.jpg);
  29.     font-family:tahoma, arial;
  30.     font-size:20px;
  31.     font-weight:bold;
  32.     color:white;
  33.     border-top:solid;
  34.     border-bottom:solid;
  35.     border-width:1px;
  36.     border-color:white;
  37. }
  38. #main {
  39.     height:556px;
  40.     width:682px;
  41.     margin-left: 10px;
  42.     float:left;
  43.     background-color: black
  44. }
  45.  
  46. #imagerow1 {
  47.     height:100px;
  48.     width:675px;
  49. }
  50.  
  51. #imagerow2 {
  52.     height:100px;
  53.     width:675px;
  54. }
  55.  
  56. #main a:link {
  57.     color: #00611C;
  58.     font-weight:bold;
  59.     text-decoration: none
  60. }
  61. #main a:visited {
  62.     color: #00611C;
  63.     font-weight:bold;
  64.     text-decoration: none
  65. }
  66. #main a:hover {
  67.     color: #00611C;
  68.     font-weight:bold;
  69.     text-decoration: underline
  70. }
  71.  
  72. #contenth1 {
  73.     height: 35px;
  74.     width:681px;
  75.     margin-top: 20px;
  76.     background-image: url(../ebayimages/gradient.jpg);
  77.     background-repeat: repeat-x;
  78.     float:left;
  79.     border-left:solid;
  80.     border-top:solid;
  81.     border-right:solid;
  82.     border-width:1px;
  83.     border-color: white;
  84.     font-family:tahoma, arial;
  85.     font-size:20px;
  86.     line-height:30px;
  87.     color:white;
  88.     font-weight: 200
  89. }
  90. #contenth2 {
  91.     height: 35px;
  92.     width:681px;
  93.     margin-top: 20px;
  94.     background-image: url(../ebayimages/gradient.jpg);
  95.     background-repeat: repeat-x;
  96.     float:left;
  97.     border-left:solid;
  98.     border-top:solid;
  99.     border-right:solid;
  100.     border-width:1px;
  101.     border-color: white;
  102.     font-family: tahoma, arial;
  103.     font-size:20px;
  104.     line-height:30px;
  105.     color:white;
  106.     font-weight: 200
  107. }
  108. #content1 {
  109.     height: 170px;
  110.     width: 681px;
  111.     background-color: #9AFF9A;
  112.     float:left;
  113.     font-family:tahoma, arial;
  114.     font-size:14px;
  115.     font-weight: 500;
  116.     border-style:solid;
  117.     border-color:white;
  118.     border-width:1px;
  119. }
  120. #content2 {
  121.     height: 250px;
  122.     width: 681px;
  123.     background-color: #9AFF9A;
  124.     float:left;
  125.     font-family:tahoma, arial;
  126.     font-size:14px;
  127.     font-weight: 500;
  128.     border-style:solid;
  129.     border-color:white;
  130.     border-width:1px;
  131. }
  132. #sidesection {
  133.     height:556px;
  134.     width:280px;
  135.     margin-right: 10px;
  136.     float:right;
  137.     background-color: black
  138. }
  139. #contenth3 {
  140.     height: 35px;
  141.     width:279px;
  142.     margin-top: 20px;
  143.     background-image: url(../ebayimages/gradient.jpg);
  144.     background-repeat: repeat-x;
  145.     float:right;
  146.     border-left:solid;
  147.     border-top:solid;
  148.     border-right:solid;
  149.     border-width:1px;
  150.     border-color:white;
  151.     font-family:tahoma, arial;
  152.     font-size:20px;
  153.     line-height:30px;
  154.     color:white;
  155.     font-weight: 200
  156. }
  157. #contenth4 {
  158.     height: 35px;
  159.     width:279px;
  160.     margin-top: 20px;
  161.     background-image: url(../ebayimages/gradient.jpg);
  162.     background-repeat: repeat-x;
  163.     float:right;
  164.     border-left:solid;
  165.     border-top:solid;
  166.     border-right:solid;
  167.     border-width:1px;
  168.     border-color: white;
  169.     font-family:tahoma, arial;
  170.     font-size:20px;
  171.     line-height:30px;
  172.     color:white;
  173.     font-weight: 200
  174. }
  175. #content3 {
  176.     height: 260px;
  177.     width: 279px;
  178.     background-color: #9AFF9A;
  179.     float:right;
  180.     font-family:tahoma, arial;
  181.     font-size:14px;
  182.     font-weight: 500;
  183.     border-style:solid;
  184.     border-color:white;
  185.     border-width:1px;
  186. }
  187. #content4 {
  188.     height: 160px;
  189.     width: 279px;
  190.     background-color: #9AFF9A;
  191.     float:right;
  192.     font-family:tahoma, arial;
  193.     font-size:14px;
  194.     font-weight: 500;
  195.     border-style:solid;
  196.     border-color:white;
  197.     border-width:1px;
  198. }
  199. #sidesection a:link {
  200.     color: #00611C;
  201.     font-weight:bold;
  202.     text-decoration: none
  203. }
  204. #sidesection a:visited {
  205.     color: #00611C;
  206.     font-weight:bold;
  207.     text-decoration: none
  208. }
  209. #sidesection a:hover {
  210.     color: #00611C;
  211.     font-weight:bold;
  212.     text-decoration: underline
  213. }
  214. #footer {
  215.     float: left;
  216.     height: 43px;
  217.     width:1000px;
  218.     background-image: url(../ebayimages/gradient.jpg);
  219.     background-repeat: repeat-x;
  220.     font-family: Tahoma;
  221.     font-size: 15px;
  222.     line-height:37px;
  223.     color: white;
  224.     border-top:solid;
  225.     border-width:1px;
  226.     border-color:white
  227. }
  228.  
  229. #leftcontent {
  230.     width:400px;
  231.     height:43px;
  232.     float:left;
  233.     text-align:left;
  234.     margin-left:15px
  235. }
  236.  
  237. #rightcontent {
  238.     width:400px;
  239.     height:43px;
  240.     float:right;
  241.     text-align:right;
  242.     margin-right:15px
  243. }
  244.  
thanks in advance
Feb 23 '09 #1
2 4061
TheServant
1,168 Expert 1GB
Being an IE problem it is likely that it requires a hack or something unnatural. Have you tried floating imagerow2 and making it display as a block? I am about to leave work so I don't have much time to go through with much detail. Someone else will be along shortly who will help more than I can.
Feb 24 '09 #2
David Laakso
397 Expert 256MB
An easy fix, providing you have control of and can modify the markup, is to move the three no-image.gif(s) to the bottom of imagerow1. And comment out or delete imagerow2 in its entirety.
Feb 24 '09 #3

Sign in to post your reply or Sign up for a free account.

Similar topics

0
by: Yarik | last post by:
Hello, When I open an HTML document by Internet Explorer 6 and then print the document on a color inkjet printer, some of the colors are rendered incorrectly (they appear much darker than they...
2
by: Koh | last post by:
My rollover image effect work fine in Netscape but not in Internet Explorer. Is there any important element or tag that I have miss out so it is not working in Internet Explorer? Below is my code,...
1
by: thehuby | last post by:
I am developing a site and have got to a point where a bug has crept in when viewing it in (you guessed it!) Internet Explorer. Somehow, somewhere a 19pixel gap is appearing at the bottom of the...
2
by: tomasio | last post by:
Dear NG-Readers, I want to position a textbox (.kasten) to the right of my website, but I need to have 1px of the background-image of the ancestor box (.content) visible. So I calculated 270px...
2
by: slaterino | last post by:
Hello, I'm hoping someone can help me with a couple of queries. I am in the process of designing a site which I have uploaded to: http://www.cca-ltd.co.uk/New/index.html, but I currently have 2...
2
by: David Lozzi | last post by:
Howdy, I have a simple file uploader in a form, and I take the image and check for the file extension. Now I when upload a jpg image in FireFox the content type is image/jpeg. When I upload the...
1
by: bogdanm | last post by:
Hello everyone, I am having a probleme with a issuu code when trying to insert it o my site it doesnt work in IE but in mozzila works fine the code is bellow: <div><object...
2
by: swethak | last post by:
Hi, I am getting the problem the problem with google map in Internet Explorer. This map worked fine in mozilla . When i opened the same map in Internet Explorer i am getting the error...
2
by: scdowney | last post by:
First and foremost, thank you in advance for any attempts to help me out. I am working on a project with work, and it requires I use CSS selectors to locate elements within a webpage. For the...
3
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 3 Jan 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). For other local times, please check World Time Buddy In...
0
by: abbasky | last post by:
### Vandf component communication method one: data sharing ​ Vandf components can achieve data exchange through data sharing, state sharing, events, and other methods. Vandf's data exchange method...
0
by: fareedcanada | last post by:
Hello I am trying to split number on their count. suppose i have 121314151617 (12cnt) then number should be split like 12,13,14,15,16,17 and if 11314151617 (11cnt) then should be split like...
0
by: stefan129 | last post by:
Hey forum members, I'm exploring options for SSL certificates for multiple domains. Has anyone had experience with multi-domain SSL certificates? Any recommendations on reliable providers or specific...
1
by: davi5007 | last post by:
Hi, Basically, I am trying to automate a field named TraceabilityNo into a web page from an access form. I've got the serial held in the variable strSearchString. How can I get this into the...
0
by: MeoLessi9 | last post by:
I have VirtualBox installed on Windows 11 and now I would like to install Kali on a virtual machine. However, on the official website, I see two options: "Installer images" and "Virtual machines"....
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
by: Aftab Ahmad | last post by:
So, I have written a code for a cmd called "Send WhatsApp Message" to open and send WhatsApp messaage. The code is given below. Dim IE As Object Set IE =...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.