Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] problemas al centrar

Estas en el tema de problemas al centrar en el foro de CSS en Foros del Web. hola a todos, le estoy haciendo una web a unos amigos y la verdad que esta quedando muy guapa, el problema que tengo es que ...
  #1 (permalink)  
Antiguo 29/10/2013, 04:22
 
Fecha de Ingreso: mayo-2013
Mensajes: 9
Antigüedad: 10 años, 10 meses
Puntos: 0
problemas al centrar

hola a todos, le estoy haciendo una web a unos amigos y la verdad que esta quedando muy guapa, el problema que tengo es que cuando veo dicha web en resoluciones altas (en las televisiones de hoy en dia) no se me ve centrada.

He probado a ponerle align center a todo pero me disloca los divs.

Podeis echarme un cable????

Código HTML:
Ver original
  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. <link href="css/mediaqueries.css" rel="stylesheet" />
  4.  
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <link rel="icon" type="image/png" href="imagenes/resto/pavicom_web.png" />
  7.  
  8. <title>Play The Game Tribute</title>
  9. <link href="css/css.css" rel="stylesheet" type="text/css" /></style>
  10.  
  11. <script type="text/javascript">
  12. var currPic=1;
  13. var totPics=14;
  14. var keepTime;
  15. function setupPicChange() { keepTime=setTimeout("changePic()", 9000); }
  16.  
  17. function changePic() {
  18.     currPic++;
  19.     if(currPic>totPics)
  20.         currPic=1;
  21.     document.getElementById("picture").src="imagenes/slider/pic"+currPic+".jpg";
  22.  
  23.     setupPicChange();
  24. }
  25. function MM_preloadImages() { //v3.0
  26.   var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
  27.     var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
  28.    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
  29. }
  30.  
  31. function MM_swapImgRestore() { //v3.0
  32.  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
  33. }
  34.  
  35. function MM_findObj(n, d) { //v4.01
  36.  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
  37.    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  38.   if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  39.   for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  40.   if(!x && d.getElementById) x=d.getElementById(n); return x;
  41. }
  42.  
  43. function MM_swapImage() { //v3.0
  44.   var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
  45.   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
  46. }
  47.  
  48. <style type="text/css">
  49. body,td,th {
  50.     color: #FFF;
  51. }
  52. a:link {
  53.     color: #FFF;
  54. }
  55. a:visited {
  56.     color: #FFF;
  57. }
  58. </head>
  59.  
  60. <body onload="setupPicChange();MM_preloadImages('imagenes/botones/boton01_biografia_seleccionado.png','imagenes/botones/boton02_labanda_seleccionado.png','imagenes/botones/boton03_tour_seleccionado.png','imagenes/botones/boton04_galeria_seleccionado.png','imagenes/botones/boton05_contacto_seleccionado.png','imagenes/botones/boton06_escucha_seleccionado.png','imagenes/rrss/boton_rrss01_twitter_seleccionado.png','imagenes/rrss/boton_rrss03_myspace_seleccionado.png','imagenes/rrss/boton_rrss04_souncloud_seleccionado.png','imagenes/rrss/boton_rrss05_mail_seleccionado.png')">
  61.  
  62. <div class="container">
  63.   <div class="header" align="center">
  64.   <a href="index.html"><img src="imagenes/resto/logo_superior.png" width="654" height="76" /></a>  
  65.   <!-- end .header --></div>
  66.   <div class="menu" align="center">
  67.         <ul id="button">
  68.             <li><a href="biografia.html" target="contenido"><img src="imagenes/botones/boton01_biografia.png" name="biografia" width="109" height="22" id="biografia" onmouseover="MM_swapImage('biografia','','imagenes/botones/boton01_biografia_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a></li>
  69.             <li><a href="labanda.html" target="contenido"><img src="imagenes/botones/boton02_labanda.png" name="labanda" width="109" height="22" id="labanda" onmouseover="MM_swapImage('labanda','','imagenes/botones/boton02_labanda_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a></li>
  70.             <li><a href="tour.html" target="contenido"><img src="imagenes/botones/boton03_tour.png" name="tour" width="109" height="22" id="tour" onmouseover="MM_swapImage('tour','','imagenes/botones/boton03_tour_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a></li>
  71.             <li><a href="galeria.html" target="contenido"><img src="imagenes/botones/boton04_galeria.png" name="galeria" width="109" height="22" id="galeria" onmouseover="MM_swapImage('galeria','','imagenes/botones/boton04_galeria_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a></li>
  72.             <li><a href="contacto.html" target="contenido"><img src="imagenes/botones/boton05_contacto.png" name="contacto" width="109" height="22" id="contacto" onmouseover="MM_swapImage('contacto','','imagenes/botones/boton05_contacto_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a></li>
  73.             <li><a href="escuchar.html" target="contenido"><img src="imagenes/botones/boton06_escucha.png" name="escucha" width="109" height="22" id="escucha" onmouseover="MM_swapImage('escucha','','imagenes/botones/boton06_escucha_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a></li>
  74.        
  75.         </ul>
  76.  
  77.     <!-- end .menu --></div>
  78. <div class="sidebar1">
  79. <div id="scrollbar" class="scrollbar">
  80.      <div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div>
  81.      <img id="picture" src="imagenes/slider/pic1.jpg"alt="picture" />
  82.             <div id="parte1" style="position:absolute">
  83.                 <div id="parte2" style="position:absolute">
  84.                     <iframe width="465" height="455" src="noticias.html" scrolling="auto" frameborder="0" id="contenido" name="contenido" ></iframe>
  85.                 </div>
  86.            
  87.   </div>
  88.    
  89.         </div>
  90.   <!-- end .sidebar1 --></div>
  91.  
  92. <div id="rrss" align="center">
  93.    
  94.   <p> <a href="https://twitter.com/TRIBUTETOQUEEN" target="_blank"><img src="imagenes/rrss/boton_rrss01_twitter.png" name="twitter" width="24" height="24" id="twitter" onmouseover="MM_swapImage('twitter','','imagenes/rrss/boton_rrss01_twitter_seleccionado.png',1)" onmouseout="MM_swapImgRestore()"/></a>
  95.     <a href="https://www.facebook.com/QueenTribute.2012?fref=ts" target="_blank"><img src="imagenes/rrss/boton_rrss02_facebook.png" name="facebook" width="24" height="24" id="facebook" onmouseover="MM_swapImage('facebook','','imagenes/rrss/boton_rrss02_facebook_seleccionado.png',0)" onmouseout="MM_swapImgRestore()" /></a>
  96.   <a href="https://myspace.com/queentribute2013" target="_blank"><img src="imagenes/rrss/boton_rrss03_myspace.png" name="myspace" width="24" height="24" id="myspace" onmouseover="MM_swapImage('myspace','','imagenes/rrss/boton_rrss03_myspace_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a>
  97.   <a href="https://www.soundcloud.com/playthegamequeenband" target="_blank"><img src="imagenes/rrss/boton_rrss04_souncloud.png" name="soundcloud" width="24" height="24" id="soundcloud" onmouseover="MM_swapImage('soundcloud','','imagenes/rrss/boton_rrss04_souncloud_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a>
  98.   <a href="mailto:[email protected]" target="_blank"><img src="imagenes/rrss/boton_rrss05_mail.png" name="mail" width="24" height="24" id="mail" onmouseover="MM_swapImage('mail','','imagenes/rrss/boton_rrss05_mail_seleccionado.png',1)" onmouseout="MM_swapImgRestore()" /></a></p>
  99. </div>
  100.  
  101. <!-- <div class="queen" align="center">
  102.  </div> end .footer -->
  103.  
  104.   <div class="footer" align="center">
  105.     <img  align="middle"src="imagenes/resto/logo_inferior.png" width="218" height="78" /></br>
  106.   <img  align="middle"src="imagenes/resto/powered by.png" width="115" height="17" />
  107. </div>
  108.   <!-- end .container --></div>
  109. </body>
  110. </html>

Última edición por pzin; 29/10/2013 a las 09:27 Razón: formato código
  #2 (permalink)  
Antiguo 29/10/2013, 09:28
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: problemas al centrar

Pues algo así en tu CSS te debería de valer:

Código CSS:
Ver original
  1. .container {
  2.   width: 1200px;
  3.   margin: 0 auto;
  4. }
  #3 (permalink)  
Antiguo 31/10/2013, 03:25
 
Fecha de Ingreso: mayo-2013
Mensajes: 9
Antigüedad: 10 años, 10 meses
Puntos: 0
De acuerdo Respuesta: problemas al centrar

pzin, OLE TUUUU!!!!!

mil gracias, lo icorporé al css y va bien!!! muchas gracias.

Etiquetas: divs
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 05:38.