Foros del Web » Creando para Internet » CSS »

crear plantilla de 2 columnas (duda)

Estas en el tema de crear plantilla de 2 columnas (duda) en el foro de CSS en Foros del Web. hola, Necesito algo de ayuda o mas bien un ejemplo de como hacerle para ponerle 2 columnas a una plantilla....mas explicado me refiero a una ...
  #1 (permalink)  
Antiguo 05/12/2010, 02:59
 
Fecha de Ingreso: diciembre-2010
Mensajes: 3
Antigüedad: 7 años
Puntos: 0
Pregunta crear plantilla de 2 columnas (duda)

hola,

Necesito algo de ayuda o mas bien un ejemplo de como hacerle para ponerle 2 columnas a una plantilla....mas explicado me refiero a una columna izquierda y otra a la derecha.

Hasta el momento no logro que quede bien les dejo el codigo hasta el momento de ejemplo.


Código:
<html>
<head>
<title></title>
<style type="text/css">
body  {
         background: brown;
         font-family: arial;
         font-size: 14px;
         text-align: center;
}

#container {
text-align: left;
width: 990px;
margin: auto;
}

#header {
         width: 990px;
         height: 180px;
         background: greenlime;
}

.logo {
         background: url();
}

#mainnav {
         width: 990px;
         height: 40px;
         background: #000;
}

#mainnav ul {
         list-style-type: none;
         padding: 5px;
}

#mainnav ul li {
         display: inline;
}

#mainnav ul li a {
         text-decoration: none;
         margin: 30px;
         padding: 10px;
         color: blue;
}

#sidebar_left {
         width: 200px;
         background: url() repeat;
}

.box_left {
}

.box_left ul {
         list-style-type: none;
         float: left;
         padding: 10px;
         margin: 10px;
}

.box_left ul li {
         display: block;
         margin: 10px;
}

.box_left ul li a {
         text-decoration: none;
         color: #0B615E;
}

#sidebar_right {
         width: 200px;
         float: right;
         background: url() repeat;
}

.box_right ul {
         list-style-type: none;
         float: right;
         padding: 10px;
         margin: 10px;
}

.box_right ul li {
         display: block;
         margin: 10px;
}

.box_right ul li a {
         text-decoration: none;
         color: #0B615E;
}

#footer {
         clear: both;
}


</style>
</head>
<body>
<div id="container">
         <div id="header" title="gremio tekken">
    <div class="logo"></div>
</div>
         <div id="mainnav">
      <ul>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
      </ul>
</div>
         <div id="content">

</div>
         <div id="sidebar_left">
   <div class="box_left">
<div class="separator_box"></div>
      <ul>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
      </ul>             
</div>
   <div class="box_left">
<div class="separator_box"></div>
      <ul>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
      </ul>             
</div>
         <div id="sidebar_right">
   <div class="box_right">
<div class="separator_right"></div>
      <ul>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
      </ul> 
   </div>  
</div>
   <div class="box_right">
<div class="separator_right"></div>
      <ul>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
              <li><a href="#">enlace</a></li>
      </ul>
  </div>   
</div>
         <div id="footer">
copyright &copy 2010 <a href="#"></a> diseño por <a href="#"></a> ímagenes por <a href="#"></a>
  </div>
</div>
</body>
</html>
no se por que el sidebar derecho no se coloca a la derecha de la plantilla y siendo que en el css le meto float: right;

EDITO POST Encontre la solucion una vez despues de postear el tema y examinarlo bien T_T

el problema eran los divs no los estaba cerrando donde eran y por ese error el float right no tomaba la propiedad.

disculpen la molestia.

Pueden cerrar el tema

saludos!

Última edición por callter; 05/12/2010 a las 03:34

Etiquetas: columnas, plantillas
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 06:36.