No logro modificar columnas css de wordpress

admoro · #1 (**permalink**) 20/06/2011, 19:59

Hola foristas. Tengo un theme de wordpress en tres columnas. Quisiera agregar un nuevo espacio por sobre las dos no principales. Es decir Sidebar 1 y 2 de la portada y no lo logro. Les muestro:

Esto es lo que tengo actualmente

Y quiero llegar a lo siguiente:

Lo he intentado de varias formas, pero, me las manda a cualquier lado o me tira todo abajo de la primera...el css es el sigueinte: (Lo que figura como sidebar_A es el que cree)

Cita:

/* STRUCTURE ----------------------------------*/
#header {
overflow:hidden;
height:100px;
margin-top:10px;

}
#header-in {
width:960px;
height:100px;
border-top:1px solid #e2e2e2; border-right:1px solid #e2e2e2; border-left:1px solid #e2e2e2;
margin: 0 auto;
background:#FFFFFF;

}
#content-wrap {
width:960px;
margin:0 auto;
height:100%;
overflow:hidden;/*background:url(images/grid.png) repeat-y center;*/
border-left: 1px solid #e2e2e2; border-right: 1px solid #e2e2e2;border-bottom: 1px solid #e2e2e2;
background:#FFFFFF;

}
#content {
float:left;
width:500px;
margin-left:4px;
margin-bottom:8px;
margin-top: 6px;
border-right: 1px dashed #e2e2e2;
padding-right:2px;
background:#FFFFFF;

/* PAGINAS INTERNAS ----------------------------------*/

}
#contentB {
float:left;
width:590px;
margin-left:14px;
margin-bottom:8px;
border-right: 1px solid #e2e2e2;
background:#FFFFFF;

}
#sidebar_3 {
float:right;
width:350px;
overflow:hidden;
Border-left: 1px solid #e2e2e2;

/* PAGINAS INTERNAS HASTA ACÁ----------------------------------*/

}
.content-in {
float:left;
width:640px !important;

}
#sidebar_l {
float:left;
width:240px;
margin-left:2px;
margin-top: 6px;

}
#sidebar_r {
float:right;
width:210px;
overflow:hidden;
border-left: 1px solid #e2e2e2;
margin-bottom: 4px;
margin-top: 6px;

}
#sidebar_A {
float: left;
margin-left: 645px;
width:400px;
overflow:hidden;
margin-bottom: 10px;
height:auto;

}
#footer {
clear:both;
height:50px;
}
#footer-in {
width:960px;
margin:0 auto;
overflow:hidden;
padding:10px 0 0 0;
border-top:0px solid #e2e2e2;

}

Desde ya muchas gracias por su tiempo

yuo2 · #2 (**permalink**) 20/06/2011, 21:24

A ver si esto te puede dar una mejor idea:

estilo.css

Código CSS:

Ver original.body
{
 
}
 
#header
{
width:960px;
height:100px;
border-top:1px solid #e2e2e2; border-right:1px solid #e2e2e2; border-left:1px solid #e2e2e2;
margin: 0 auto;
background:#999933;
 
}
 
#contenedor
{
width:960px;
margin:0 auto;
height:100%;
overflow:hidden;/*background:url(images/grid.png) repeat-y center;*/
border-left: 1px solid #e2e2e2; border-right: 1px solid #e2e2e2;border-bottom: 1px solid #e2e2e2;
 
}
 
#col1
{
float:left;
width: 420px;
position: relative;
height: 300px;
background:#999933;
 
}
 
#col2
{
float:right;
width: 540px;
position: relative;
height: 100px;
background:#CC0066;
}
 
 
#col3
{
float:left;
width: 270px;
position: relative;
height: 200px;
background:#999933;
}
 
#col4
{
float:left;
width: 270px;
position: relative;
height: 200px;
background:#999933;
}
 
 
.clear{clear:both}
 
 
#pie
{
width:960px;
margin:0 auto;
height:100px;
background:#999933;
}

HTML:

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin titulo</title>
<link href="estilo.css" rel="stylesheet" type="text/css" media="screen" charset="utf-8" />
</head>
 
<body>
<div id="header">CABECERA</div>
 
<div id="contenedor">
 
<div id="col1">MENU</div>
<div id="col2">AGREGAR</div>
<div id="col3"></div>
<div id="col4"></div>
 
</div>
<div id="clear"></div>
<div id="pie">PIE</div>
 
</body>
</html>

admoro · #3 (**permalink**) 20/06/2011, 22:09

Hola, gracias, pero, no he logrado aún quede bien. Mira yo tengo que insertarlo en un theme wordpress de esta manera desde el index:

<?php include (TEMPLATEPATH . "/sidebarA.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar1.php"); ?>
<?php include (TEMPLATEPATH . "/sidebar2.php"); ?>

Entonces el sidebar A me tiene que quedar sobre el 1 y el 2 que caen bajo este...

Muchas gracias de nuevo...

admoro · #4 (**permalink**) 21/06/2011, 00:07

Hola a todos, gracias por su tiempo. Quería comentar que encontré la solución. Era una problema de Float y de margin....además del nombre dado al css.
Muchas gracias.