Foros del Web » Creando para Internet » CSS »

Ancho de columnas con CSS

Estas en el tema de Ancho de columnas con CSS en el foro de CSS en Foros del Web. Buenas tardes, Utilitzo wordpress para la web del trabajo y necesito hacer una modificación en la plantilla. Uso el tema Graphene de dos columnas y ...
  #1 (permalink)  
Antiguo 20/10/2014, 07:19
 
Fecha de Ingreso: octubre-2014
Mensajes: 3
Antigüedad: 9 años, 4 meses
Puntos: 0
Exclamación Ancho de columnas con CSS

Buenas tardes,

Utilitzo wordpress para la web del trabajo y necesito hacer una modificación en la plantilla. Uso el tema Graphene de dos columnas y quiero pasarlo a 3. El cambio es sencillo pero mi problema viene cuando una vez lo tengo en 3 columnas quiero cambiar el ancho. Hay infinidad de valores y he modificado unos cuantos pero a ciegas. COnsigo algun cambio pero no el deseado.

No se si alguien me puede indicar concretamente que valres del codigo determinan el ancho de las barras laterales. Dejo copiado el codigo original

Muchas gracias por adelantado

/* =Sidebars
-------------------------------------------------------------- */

#sidebar1,
#sidebar2 {
display: inline;
float: left;
margin-top: 4px;
padding: 0 15px 30px;
width: 255px;
}
#sidebar2 {
padding-left: 0;
}
.three-columns #sidebar1,
.three-columns #sidebar2 {
width: 227px;
}
.three-col-center #sidebar1,
.three-col-center #sidebar2 {
padding: 0 15px 30px 15px;
}
.sidebar h3 {
background: url(images/bg-sidebar-h3.png) left bottom repeat-x #3C9CD2;
background: -moz-linear-gradient(#3C9CD2, #1F6EB6);
background: -webkit-linear-gradient(#3C9CD2, #1F6EB6);
background: linear-gradient(#3C9CD2, #1F6EB6);
border-bottom: 1px solid #195392;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
border-radius: 5px 5px 0 0;
color: #fff;
*display: inline;
font: bold 16px/20px arial;
margin: -15px 0 5px -12px;
padding: 7px 12px;
text-shadow: 0 -1px 0 #555;
width: 100%;
zoom: 1;
}
.sidebar h3 a,
.sidebar h3 a:visited,
.sidebar h3 a:hover {
color: #fff;
}
.sidebar div.sidebar-wrap {
background: #fff;
border: 1px solid #ccc;
-moz-box-shadow: 0 0 5px #BBB;
-webkit-box-shadow: 0 0 5px #BBB;
box-shadow: 0 0 5px #BBB;
margin-bottom: 16px;
padding: 10px 12px;
position: relative;
}
.three-columns .sidebar div.sidebar-wrap {
width: 200px;
}
.sidebar #tweetfollow {
margin-top: 5px;
text-align: right;
}
#sidebar_bottom {
background: #E3E3E3;
clear: both;
margin-top: -10px;
padding: 0 0 20px 0;
}
#sidebar_bottom .sidebar-wrap {
display: inline-block;
*display: inline;
margin: 10px 0 5px 15px;
padding: 10px;
vertical-align: top;
width: 278px;
zoom: 1;
}
#sidebar_bottom .sidebar-wrap h3 {
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
margin: -10px -10px 10px -10px;
padding: 7px 10px;
width: 100%;
height: auto;
}
#calendar_wrap {
text-align: center;
}
#wp-calendar {
border-collapse: collapse;
margin: 0 auto;
}
#wp-calendar #today {
font-weight: bold;
}
#wp-calendar td,
#wp-calendar th {
padding: 3px 4px;
}
#wp-calendar #prev {
text-align: left;
}
#wp-calendar #next {
text-align: right;
}
.sidebar ol {
list-style-position: outside;
margin-left: 29px;
}
.sidebar ol ol {
list-style-type: lower-alpha;
margin-left: 20px;
}
.sidebar ul ul {
margin-left: 20px;
}
.sidebar ol ol ol {
list-style-type: lower-roman;
}
.sidebar ol li {
line-height: 15px;
padding: 2px 0;
}
.sidebar ul ul li {
border: none;
}
.sidebar ul ul li {
line-height: 15px;
}
.sidebar p {
line-height: 18px;
}
.sidebar p img {
border: 4px solid #dedede;
}
.sidebar ul {
list-style-position: outside;
list-style-type: none;
}
.sidebar ul li {
border-bottom: 1px solid #e3e3e3;
line-height: 15px;
padding: 6px 0;
}
.sidebar ul li img,
.sidebar ol li img {
display: inline;
margin: 0 2px;
vertical-align: middle;
}
.sidebar ul li span.meta-rss {
display: inline-block;
width: 0px;
height: 16px;
}
  #2 (permalink)  
Antiguo 20/10/2014, 09:12
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.725
Antigüedad: 22 años, 1 mes
Puntos: 998
Respuesta: Ancho de columnas con CSS

es difícil saberlo sin tener la estructura del html, de todas formas te recomiendo instalarte una extensión como firebug y de esa forma puedas inspeccionar el código de forma visual y no hacer los cambios a ciegas.
__________________
Pasamos tus PSD a HTML

Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. -

Etiquetas: ancho, background, color, columnas, hover, width
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 00:25.