Ver Mensaje Individual
  #6 (permalink)  
Antiguo 02/02/2007, 19:00
Avatar de Ruben_JD
Ruben_JD
 
Fecha de Ingreso: diciembre-2003
Ubicación: Quito-Ecuador
Mensajes: 218
Antigüedad: 20 años, 4 meses
Puntos: 7
Re: Problema con maquetacion en CSS

Prueba con este codigo, me funciono en IE, opera y firefox:
Código HTML:
<html>
<head>
    <title></title>    
</head>
<style type="text/css">
BODY { background-color: #FFFFFF; font: 11px Arial; margin: 0px; text-align: center; }
#decoracio{ background-image: url('taudalt.gif'); background-repeat: repeat-x; height: 6px!important; }
#contenidor{ margin: auto; text-align: left; width: 770px; }
#dalt{ background-color: #00CCFF; color: #FFFFFF; font-size: 12pt; font-weight: bold; margin-top: 20px; text-indent: 10px; /* sangria de 10px; */ }
#dalt2{ background-color: #282828; /*align: center;*/ width: 770px; }
#dalt3{ background-color: #282828; height: 62px; margin: 0 auto; }
#cos{ margin-top: 15px; }
#lateral{ background-color: #F6F5F5; float: left; width: 160px; }
#central{ float: right; /*margin-left: 170px;*/ margin: auto; width: 600px; }
#dins{ width: 400px; }
#dinss{ background-color: #282828; color: #FFFFFF; float: right; text-align: center; width: 190px; }
h5{ font-size: 95%; margin: 0; }
#peu{ background-color: #F3F3F3; clear: both; margin-top: 20px; text-align: center; width: 100%; }
*
.negrita{ font-size: 12px; font-weight: bold; }
/* Menu Horizontal */ 
#menu { border: none; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 11px; /* es mejor manejarlo todo en pixels, mayor presición, cualquier navegador lo entiende */ font-weight: bold; height: 25px; }
#menu img{ border: none; float: left; /* siempre colocado a la izquierda del contenedor */ margin-right: 50px; /* separación con los botones del menu */ }
#menu ul { list-style-type: none; /* ningun simbolo para las listas o viñetas */ margin: 0; padding: 20px 0 20px 0; }
#menu li { display: inline; /* disposición en linea recta de botones */ }
#menu a { background: url(boto2_1.gif) no-repeat left top; float: left; /* parte izquierda del boton siempre a la izquierda */ padding: 0 0 0 3px; text-decoration: none; }
#menu a span { background: url(boto2.gif) no-repeat right top; /* completamos el boton */ color: #000000; display: block; padding: 6px 18px 9px 10px; text-align: center; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#menu a span { float: none; }
/* End IE5-Mac hack */
#menu a:hover span { color: #FFFFFF; }
#menu a:hover { background: url(boto1_1.gif) no-repeat left top; }
#menu a:hover span { background: url(boto1.gif) no-repeat right top; }
#menu #current a { background: url(boto1_1.gif) no-repeat left top; /* boton seleccionado por defecto */ }
#menu #current a span { background: url(boto1.gif) no-repeat right top; color: #FFFFFF; }
/* Fin Menu Horizontal */
em { color: #00CCFF; font-weight: bold; padding: 0 4px 0 4px; }
.tusencuestas_pregunta { font-weight: bold; }
</style>
<body>
<div id="dalt3">
<div id="contenidor"> <!-- Centramos imagen y menu al tamaño de la página 770px -->
    <div id="menu">
    <img src="logo.gif" width="273" height="62">
         <ul>
             <li id="current"><a href=""><span>INICI</span></a></li>
            <li><a href=""><span>LLOC</span></a></li>
            <li><a href=""><span>HORARIS</span></a></li>
            <li><a href=""><span>GRUPS</span></a></li>
            <li><a href=""><span>FIRMA</span></a></li>
         </ul>
      </div>
    </div>
</div>
<div id="contenidor">
    <div id="dalt">Meruts festival</div>
    <div id="cos"></div>
    <div id="lateral">           
        <div id="decoracio"></div>
        Aquí va la encuesta 
    </div>
    
    <div id="central">
        <div id="decoracio"></div>
        <div id="dinss"> publicitat </div>
        <div id="dins">
            <h5>SOBRE EL MERUT'S FESTIVAL</h5>
            <span>El<em>merut's festival</em>es presenta enguany com una aposta per bla bla bla.</span>
        </div>
    </div>
    <div id="peu">
        <span class="negrita">Merut's Festival 2007</span><span>- Contacte - Publicitat - Horaris - Lloc - Grups</span></div>
    </div> 
</div>
</body>
</html> 
las imagenes:




espero que te sirva.
__________________
RubénJ. Regresando al foro despues de un par de años. A preguntar más de las novedades del foro.