Problema con posicionamiento de barra lateral en explorer

[jonh_doe]

Hola buenas,
estoy empezando en esto del diseño web con css y estoy teniendo un problema que no entiendo (la verdad es que no entiendo casi nada, simplemente voy probando). En Chrome se ve bien, pero en Firefox y Explorer la barra lateral me aparece a mitad de página en lugar de arriba, a la misma altura que el contenido.

Por otro lado, conoceis algún libro o recurso online donde pueda ver ejemplos prácticos (prefiero aprender con tutoriales que con manuales).
Os pongo el codigo del css. La barra lateral tan solo contiene una lista con enlaces. Muchas gracias de antemano.
Un saludo.

Código HTML:

body {
  font-family:Helvetica, Arial, sans-serif;
  font-size:13px;
  font-style:normal;
  font-variant:normal;
  font-weight:normal;
  line-height:22px;
}

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;
}