Cita:
Iniciado por pzin 
Pues no parece que con ese código se pueda reproducir el problema, ya que no hay ninguna propiedad que afecta al posicionamiento ni al comportamiento del elemento.
¿Cuál es la diferencia entre un manual y un
tutorial? Para mi son la misma cosa, más aún cuando la segunda palabra no existe en español.
Un buen comienzo pueden ser los manuales de [URL="http://librosweb.es"]librosweb.es[/URL].
Puede que me equivoque pero creo que...
Un tutorial consiste en una secuencia logica de pasos que te llevan a solucionar un problema aprendiendo a su vez de manera incremental. Debe ser seguido en orden y normalmente implica un ejemplo que sirve como guía para el aprendizaje.
Un manual no necesita ser leido en orden y no implica ningun ejemplo práctico, sería algo así como una referencia.
Te pongo a continuacion todo el código CSS. La barra lateral esta dentro de el div contenido y me gustaria que estuviese a la misma altura que el div contenidoPrincipal.
Gracias por la respuesta.
Un saludo.
Código HTML:
body {
margin: 0 auto;
width: 940px;
font: 13px/22px Helvetica, Arial, sans-serif;
}
.pagina {
background:#fff;
}
header {
text-align:center;
}
h1 {
font-size: 28px;
line-height: 30px;
padding: 10px 0;
}
.titulo {
font-size: 50px;
color:#3743a1;
text-decoration-color:#3743a1;
text-shadow: 2px 2px 3px #000;
}
h2 {
font-size: 23px;
line-height: 25px;
padding: 10px 0;
}
h3 {
font-size: 18px;
line-height: 20px;
padding: 11px 0;
}
p {
padding-bottom: 22px;
}
nav {
position: relative;
background:#bee4fe;
display:block;
left: 0;
width: 940px;
height:20px;
}
nav ul {
margin: 0;
width: 960px;
list-style: none;
/*border:solid;*/
}
nav ul li {
float: left;
}
nav ul li a {
display: block;
margin-right: 20px;
width: 155px;
font-size: 18px;
line-height: 44px;
text-align: center;
text-decoration: none;
color: #3743a1;
font-weight: bold;
border-radius:10px;
}
nav ul li a:hover {
color: #fff;
background-color: #3743a1;
}
nav ul li.selected a {
color: #fff;
}
#intro {
position: relative;
left:0;
margin-top: 33px;
padding: 22px;
background: #467612;
border-radius: 25px;
width:auto;
text-align:center;
height:auto;
}
#content {
display: table;
border-top: 1px solid #3743a1;
/*border-color:#467612;*/
}
#contenidoPrincipal {
display: table-cell;
width: 720px;
margin: 30px;
border-color:#3743a1;
font: 14px Tahoma, sans-serif;
}
aside {
/*display: table-cell;*/
background:#bee4fe;
width: 220px;
border-radius:10px;
/*height:660px;*/
height:auto;
border-color:#f52929;
}
aside ul {
margin:0;
padding:5px;
/*border:solid;*/
border-color:#3743a1;
list-style: none;
}
aside ul li {
margin: 5px;
border-color:#467612;
}
aside ul li a {
display: block;
margin: 10px;
/*width: 140px;*/
font-size: 18px;
line-height: 44px;
text-align: center;
text-decoration: none;
color: #3743a1;
font-weight: bold;
border: 1px solid #3743a1;
border-radius:10px;
}
aside ul li a:hover {
color: #fff;
background-color: #3743a1;
}
aside ul li.selected a {
color: #fff;
}
footer {
position: absolute;
left: 0;
width: 100%;
background: #681E1E;
}
footer div {
display: table;
margin: 0 auto;
padding: 44px 0;
width: 940px;
color: #777;
}
footer div section {
display: table-cell;
width: 300px;
}
footer div #acerca, footer div #otrosBlogs {
padding-right: 20px;
}
footer h3 {
color: #FFF;
}
footer a {
color: #999;
}
footer a:hover {
color: #FFF;
text-decoration: none;
}
footer ul {
margin: 0 0 0 40px;
list-style: square;
color: #565656;
}
footer ul li a {
display: block;
}
form {
/*width: 35em;
margin: 0 auto;*/
padding: 50px 60px;
display:block;
overflow: auto;
color: #051026;
/*border-radius: 10px;
box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
border-color:#f89c09;
background-color: #bee4fe;
background: -webkit-gradient( linear, left bottom, left top, color-stop(0,#fff), color-stop(1, #bee4fe));
background: -moz-linear-gradient( center bottom, #fff 0%, #bee4fe 100% ); */
}
form ul {
list-style: none;
margin: 0;
padding: 0;
}
form ul li {
margin: .9em 0 .9em 0;
}
form ul li label {
width: 25%;
float:left;
}
form * {
line-height: 1em;
}
form h3 {
margin: 0 0 1.5em 0;
padding: 0;
text-align: center;
}
fieldset {
padding: 0 20px 20px;
margin: 0 0 30px;
border:none;
border-top: 2px solid #3743a1;
border-bottom: 2px solid #3743a1;
/*border: 2px solid #593131;
border-radius: 10px;
background: #FAFF9E;*/
background: -webkit-gradient( linear, left bottom, left top, color-stop(0,#bee4fe), color-stop(1, #FFF) );
background: -moz-linear-gradient( center bottom, #bee4fe 0%, #FFF 100% );
}
legend {
color: #000;
background: #FFE98C;
font-family: Arial, Helvetica, sans-serif;
font-size: 0.9em;
font-weight: bold;
text-align: center;
padding: 5px;
margin: 0;
width: 9em;
border: 2px solid #593131;
border-radius: 50% 35%;
box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
}
input, select, textarea {
display: block;
margin: 0;
padding: .4em;
width:25%;
}
input, textarea, .date {
border: 2px solid #eae1c0;
border-radius: 5px;
box-shadow: rgba(0,0,0,.5) 1px 1px 1px 1px inset;
background: #fff;
}
input {
font-size: .9em;
}
input[type='checkbox'] {
display:inline-block;
width:inherit;
}
.pregunta {
display:block;
padding-top:5px;
padding-bottom: 5px;
font-weight:bold;
}
.opciones {
display:block;
margin-bottom:10px;
}
select {
padding: 0;
margin-bottom: 2.5em;
position: relative;
top: .7em;
}
textarea {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: .9em;
height: 5em;
}
form *:focus {
border: 2px solid #593131;
outline: none;
box-shadow: none;
}
input:valid, textarea:valid {
background: #efe;
}
#desplegable1 {
display:none;
}
#desplegable2 {
display:none;
}
legend {
cursor:pointer;
}