http://www.adamcochran.info/I-Gard/
The problem I am having is I have placed the Images using absolute div's which seems to be the wrong thing to do because while it looks nice in its current resolution when I expand the browser size (or shrink it) the images move all over the place
I have tried relative, absolute, fixed, and float divs nothing seems to just stay where it should! What am I doing wrong?
Here's the code:
Expand|Select|Wrap|Line Numbers
- <!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>
- <link rel="stylesheet" type="text/css" href="css/style.css"/>
- </head>
- <body>
- <div id="main">
- <div id="header">
- <div id="search">
- <form action="" method="get">
- <input type="text" class="searchbox" name="find" id="find" size="1" />
- <input type="submit" class="button" name="submit" value="Search" id="submit" />
- </form>
- </div><!--/search-->
- <div id="menu">
- <ul class="menu">
- <li class="parent"><a href="#"><span>Products</span></a>
- <ul>
- <li><a href="#"><span>Product 1</span></a></li>
- <li><a href="#"><span>Product 2</span></a></li>-
- <li><a href="#"><span>Product 3</span></a></li>
- <li><a href="#"><span>Product 4</span></a></li>
- </ul>
- </li>
- <li><a href="#"><span>Industries</span></a></li>
- <li><a href="#"><span>Services</span></a></li>
- <li><a href="#"><span>Store</span></a></li>
- <li><a href="#"><span>News</span></a></li>
- <li><a href="#"><span>About Us</span></a></li>
- </ul>
- </div><!--/menu-->
- <div class="images">
- <ul>
- <li><a href="#"><img src="images/img-01.gif" alt="" /></a></li>
- <li><a href="#"><img src="images/img-02.gif" alt="" /></a></li>
- <li><a href="#"><img src="images/img-03.gif" alt="" /></a></li>
- <li><a href="#"><img src="images/img-04.gif" alt="" /></a></li>
- </ul>
- </div><!--/images-->
- <div class="submenu">
- <ul class="menu">
- <li><a href="#"><span>Contact Us</span></a></li>
- <li><a href="#"><span>Feedback</span></a></li>
- <li><a href="#"><span>Sign In</span></a></li>
- </ul>
- </div><!--/submenu-->
- </div><!--/header-->
- <div style="position: absolute; left: 390px; top: 230px;">
- <img src="http://www.petervaldivia.com/technology/electricity/powerpoint/image/color_code_table.jpg">
- </div>
- <div style="position: absolute; left: 890px; top: 230px;">
- <a href="http://www.i-gard.com/"><img src="http://www.kudit.com/applications/resistorvalue/images/icon_hr.png"></a>
- </div>
- <table width="100%" cellpadding="0" cellspacing="10" border="0">
- <tr>
- <br><br><br>
- <td width="20%" valign="top">
- <p><b><u><font color="blue">What is the function of a Neutral Grounding Resistor?</font></u></b></p>
- <br>
- <p>Neutral Grounding resistors are similar to fuses in that they do nothing until something in the system goes wrong. Then, like fuses, they protect personnel and equipment from damage.</p>
- <br>
- <p>Damage comes from two factors, how long the fault lasts and how large the fault is .Ground fault relays trip breakers and limit how long a fault lasts. Neutral grounding resistors limit how large the fault is. </p>
- <br>
- <p>An effective NGR will both limit the fault current and yet allow sufficient fault current to positively actuate the over-current device.</p>
- </p>
- </td>
- <td width="33%" valign="top">
- <p><img src=""></p>
- </td>
- <td width="33%" valign="top">
- <p><img src=""></p>
- <p><img src=""></p>
- </td>
- </tr>
- </table>
- <br><br><br><br>
- <div id="footer">
- </div>
- </div><!--/main-->
- </body>
- </html>
Any insights?
Many thanks,
Adam