Configuración:
.
Biología
.
Botánica
.
Tecnología
.
Sociedad
A mis trece años de edad, el día 2 de Diciembre de 2007 inicié ‘El Balcón de Jame’. Este humilde espacio, cuyo secreto siempre fue el de compartir sin recibir nada a cambio, me dio la oportunidad de conocer un mundo nuevo, un entorno en el que me sentía yo mismo.

Hoy, 17 de abril de 2011 finalizo esta etapa de mi vida con una gran sonrisa y junto al recuerdo que este blog y cada unos de vosotros me habéis concedido.

He sido bloggero.

Jaime Trujillo Escobedo.

Sidebar o barra lateral al lado del título del blog

Al añadir unas líneas de CSS podemos conseguir que la sidebar o barra lateral del blog se muestre justo al lado del título del blog, a su misma altura y con un aspecto bastante profesional.

Esto se consigue por medio de los márgenes, los cuales serán negativos para hacer que la sidebar se "traslade" hacia arriba y poder así conseguir la estructura deseada...



Diseño>Edición de HTML>expandimos artilugios




Busca estos bloques de CSS en tu plantilla (estarán un tanto separados, por lo que encuentra primero uno y después el otro):

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Ten en cuenta que posiblemente no tengan el mismo aspecto. Lo que realmente debe coincidir es el nombre del elemento (header-wrapper y sidebar-wrapper).

Añádeles las líneas que ves en color rojo...

#header-wrapper {
width:420px;
float: left;
border:1px solid $bordercolor;
}

#sidebar-wrapper {
margin-top: -110px;
margin-left: 30px;
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

La primera línea que has añadido hará que la cabecera del blog se encoga, ofreciendo así un mayor espacio para que la barra lateral pueda situarse a su derecha.

Las otras dos líneas hacen que la sidebar "suba" -110 píxeles (debe ser un valor en negativo para que ascienda de posición) y 30 píxeles hacia la derecha.

Puedes editar dichos valores para adaptarlo a tu blog.

Guarda la plantilla para terminar:


Escribe tu comentario en la entrada...

El Balcón de Jaime fue terminado el 17 de abril de 2011. Leer despedida.

Me gustaría conocer tu opinión. El comentario será moderado y en breve se publicará.

Si deseas incluir un enlace utiliza este código:

<a href="Dirección de tu página">Titulo del enlace</a>

Para publicar un código haz uso del Conversor de entidades.

Intenta escribir sobre algo relacionado con el artículo. Si no lo haces, podría tardar en responderte.

¿Problemas al comentar? Utiliza el formulario antiguo