Hola a todos de nuevo hace nueve días hice un post para pedir ayuda como ya nadie volvió a responder tuve que googlear un poco y encontré algo sobre que había que usar porcentajes en lugar de pixeles.
Con resolución de 1366x768 todo esta bien centrado como verán:
Pero en una resolución de 1024x768 los objetos de la izquierda se mueven aunque los de la derecha se mantiene en su lugar:
He aquí el código fuente:
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</html>
<head>
<!-- The Title of the Website -->
<title>Inicio - Nacional Ferretera de Hidalgo S.A. de C.V.</title>
<!-- The Style Sheet -->
<link href="http://f.cl.ly/items/3k2t2o1Z1T1f0t0s2b0m/ios%20obscuro.css" rel="stylesheet" type="text/css"/>
<!-- The Favicon -->
<link href="http://cl.ly/2r2F0A2o2y143S0d0k2D/favicon_2.ico" rel="shortcut icon" type="image/ico" />
<!-- Required Jquery Engines --><script src="http://f.cl.ly/items/2t451J182k292A3U0R2g/jquery.js" type="text/javascript"></script><script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.js"></script><!-- Sliding Panel Code --><script type="text/javascript" src="http://f.cl.ly/items/1w1V1W0E0P0f0x2A3v3F/slider.js"></script><!-- Sliding Start Button Code --><script src="http://f.cl.ly/items/1M0u042z1u13293u1c3E/menu.js" type="text/javascript"></script><!-- Meta Data for Windows 7 Pinning Feature -->
<!-- This should be the Name of your Site. -->
<meta content="Metro" name="8 Start" />
<!-- This should point to the directory where this site is, otherwise known as your main directory. -->
<meta content="#" name="msapplication-starturl" />
<!-- This should be your content description for you site. -->
<meta content="Pagina principal de Nacional Ferretera de Hidalgo S.A. de C.V." name="msapplication-tooltip" />
</head>
<body> <div align="center"><img src="http://i.imgur.com/W2nHn.png" width="700" height="120" align="bottom"></div>
<!-- This is the Start Menu. -->
<div class="container">
<div id="tab-nav-1" class="tab-nav">
<ul>
<li>
<!-- This is the actual Start Button. -->
<a href="#" title="Has clic aqui para expandir el menu"><img src="http://i.imgur.com/beg4Y.png" border="0"></a>
<ul>
<ul>
<!-- These are Start Menu Items. -->
<li>
<a href="" title="Informate sobre nosotros y a que nos dedicamos" target="_ELSE"><img border="0" src="http://i.imgur.com/7yMVP.png" /></a></li>
<li>
<a href="" title="Revisa nuestro catalogo seguro encontraras lo que necesitas"target="_ELSE"><img border="0" src="http://i.imgur.com/jFb3I.png" /></a></li>
<li>
<a href="http://www.google.com/chrome" title="La pagina se ve mejor con el navegador Google Chrome compruebalo"target="_ELSE"><img border="0" src="http://platform.ak.fbcdn.net/www/app_full_proxy.php?app=45439413586&v=1&size=z&cksum=2ef2373519d6b824b71d2faa7308ffb7&src=http%3A%2F%2Fwww.thechromesource.com%2Fwp-content%2Fuploads%2F2011%2F07%2FNew-Chrome-Icon-300x300.png" /></a></li>
</ul>
</li>
</ul>
</div>
</div>
<br />
<!-- Google Map Panel End -->
<div class="box peek" style="position:absolute; left:49.53%; top:251px;">
<a href="http://" title="Encuentra la sucursal mas cercana a ti" target="_ELSE"><img src="http://i.imgur.com/qFitA.png"/></a>
<a href="http://" title="Encuentra la sucursal mas cerca a ti" target="_ELSE"><img class="cover" src="http://i.imgur.com/Rum20.png"/></a></div>
<div class="double" style="position:absolute;left:49.53%; top:254px;">
</div>
<!-- Google Map Panel End -->
<!-- Facebook Panel Start -->
<div class="box peek" style="position:absolute; left:49.53%; top:92px;">
<a href="http://facebook.com" title="Danoabs un me gusta en Facebook" target="_ELSE"><img src="http://i.imgur.com/Kq3Ez.png"/></a>
<a href="http://facebook.com" title="Dale me gusta en Facebook" target="_ELSE"><img class="cover" src="http://i.imgur.com/FHBto.png"/></a></div>
<div class="double" style="position:absolute; left:49.53%; top:92px;">
</div>
<!-- Facebook Panel End -->
<!-- Mail Panel Start -->
<div class="box peek" style="position:absolute; left:26.35%; top:92px;">
<a href="mailto:[email protected]" title="Para pedidos, preguntas, dudas y/o comentarios envianos un e-mail"><img src="http://i.imgur.com/4Rpjr.png"/></a>
<a href="mailto:[email protected]" title="Para pedidos, preguntas, dudas y/o comentarios envianos un e-mail"><img class="cover" src="http://i.imgur.com/6wmNd.png"/></a></div>
<div class="double" style="position:absolute; left:26.35%; top:92px;">
</div>
<!-- Mail Panel End -->
<!-- Twitter Panel Start -->
<div class="box peek" style="position:absolute; left:26.35%; top:251px;">
<a href="http://twitter.com" title="Siguenos en Twitter" target="_ELSE"><img src="http://i.imgur.com/Lu0ap.png"/></a>
<a href="http://twitter.com" title="Siguenos en Twitter" target="_ELSE"><img class="cover" src="http://i.imgur.com/7IIKO.png"/></a></div>
<div class="double" style="position:absolute; left:26.35%; top:251px;">
</div>
<!-- Twitter Panel End -->
</body>
</html>