Tema: Modulo right se baja
Ver Mensaje Individual
  #22 (permalink)  
Antiguo 04/08/2011, 04:05
summermojito
 
Fecha de Ingreso: enero-2011
Ubicación: Madrid
Mensajes: 127
Antigüedad: 13 años, 3 meses
Puntos: 14
Respuesta: Modulo right se baja
Ok, ahora si:

He cambiado algunas cosillas pero tu problema principal estaba en la capa "gutter" que está vacía y le has puesto un ancho y alto de 20px. Por eso se te baja un poco Inicio. Si quitas esa capa y/o sus estilos se ve OK.

Aquí te pego el código con los cambios que he hecho:

Código HTML: 
Ver original
  1. <html>
  2. <style>
  3. /*Gutter Space */
  4. #content{
  5.   padding: auto;
  6.   margin: auto;
  7.   overflow:visible;
  8. }
  9.   
  10. #content_container{
  11.   padding: auto;
  12.   margin: auto;
  13.   width: 960px;
  14.   overflow:visible;
  15.   
  16.   }
  17.   
  18. /* Titulo modulos */
  19.  
  20. .lefti {
  21.     padding: 0px 20px 0px 20px;
  22.     color: #1d4674;
  23.     text-decoration: none;
  24.     font:normal 14px "Trebuchet MS", Arial, Helvetica, sans-serif;
  25.     line-height: 40px;
  26.     font-weight:bold;
  27.     background: url(../images/menu_lefti.png) no-repeat; 
  28.     width: 228px;
  29.     clear:both;
  30. }  
  31. /* These styles create the Left Panel */
  32.  
  33. #left{
  34.   width:228px;
  35.   margin: 0px;
  36.   padding: 0px;
  37.   float: left;
  38. }
  39.  
  40. #left h3{
  41.   font: normal 22px/30px "Trebuchet MS", Georgia Arial, Helvetica, sans-serif;
  42.   color:#000;
  43.   letter-spacing:-0.5px;
  44.   padding:3px 0;
  45.   margin:0px;
  46. }
  47.  
  48. /* These styles create the Left Panel menus. */
  49.  
  50. #left ul.menu {
  51.   margin: 0;
  52.   padding: 0px 0px 40px 0px !important;
  53.   height: auto !important;
  54. }
  55.  
  56. #left ul.menu li {
  57.   list-style: none;
  58.   float: none !important;
  59.   border-bottom: 1px solid #ccc;
  60. }
  61. #left ul.menu li a {
  62.   display: block;
  63.   padding: 8px 0px 8px 25px;
  64.   color: #1d4674;
  65.   text-decoration: none;
  66.   line-height: normal !important;
  67.   font-weight:normal;
  68.   background-image:url(../images/bullet1.gif);
  69.   background-repeat: no-repeat;
  70.   background-position: left center;
  71. }
  72. #left ul.menu li a:hover {
  73.   background-image:url(../images/bullet2.gif);
  74.   background-repeat: no-repeat;
  75.   background-position: left center;
  76.   border: none;
  77.   color: #000;
  78. }
  79.  
  80. #gutter{
  81.   width: 20px;
  82.   height: 20px;
  83.   margin: 0px;
  84.   padding: 0px;
  85.   float: left;
  86.  
  87. }
  88.  
  89. /* These styles create the Right Panel */
  90.  
  91. #right{
  92.   width:712px;
  93.   margin: 0px;
  94.   padding: 0px;
  95.   float: left;
  96. }
  97.  
  98. #right h2, #right h2 a{
  99.   font: normal 22px/30px "Trebuchet MS", Georgia Arial, Helvetica, sans-serif;
  100.   color:#195394;
  101.   letter-spacing:-0.5px;
  102.  
  103.   border-bottom: 1px solid #999999;
  104.  
  105.     padding:0px 0px 4px 0px;
  106.   margin:0px 0px 0px 0px;
  107. }
  108.  
  109.  
  110.  
  111. #right div.item{
  112.   width:220px;
  113.   float:left;
  114.   margin: 5px 17px 5px 0px;
  115.   border-bottom: 1px solid #999999;
  116. }
  117. </style>
  118. <!--Page Content Area----------------------------------> 
  119. <div id="content"> 
  120.   <div id="content_container"> 
  121.     <div class="lefti"> 
  122.     Servicios:
  123.     <div id="left"> 
  124.             <div class="moduletable"> 
  125.                     
  126. <ul class="menu"> 
  127. <li id="item-108"><a href="/magar/index.php/laboral" >Laboral</a></li></ul> 
  128.         </div> 
  129.     
  130.     </div> 
  131.     </div> 
  132.     <!--<div id="gutter"></div>-->
  133.     <div id="right"> 
  134.     <!--breadcrumbs----------------------------------> 
  135.     <div id="breadcrumbs"></div> 
  136.         <!--MAIN CONTENT----------------------------------> 
  137.         <div class="item-page"> 
  138.     <h2> 
  139.             Inicio      </h2> 
  140.  
  141.  
  142.  
  143.  
  144.  
  145.     
  146.  
  147.     <p>Prueba Inicio</p>    
  148.     </div> 
  149.     </div> 
  150.     
  151.   </div> 
  152. </div> 
  153. </html>
__________________
Ayudas Accesibilidad

Faston