Divs que se superponen
1 seguidor
Soy un poco novato y me ha surgido un error creando una web. La idea es crear una web con una cabecera y un menú lateral fijos. El caso es que el menú lateral se superpone con la cabecera habiéndoles puesto float:left y clear:both a ambos. He probado a ir cambiando position:fixed a absolute y a poner clear:both pero tampoco me da resultado. Cualquier otro div que ponga se superpone también.
No puedo dejar enlace porque lo tengo en local, no está subido a internet.
Espero que alguien me pueda ayudar.

Usuario desconocido
Lo he pegado tal cual en un codepen y si que funciona...
https://codepen.io/anon/pen/bvRKgW
Usuario desconocido
Pues entonces está "bien", Al poner el fixed a la cabecera la sacas del flujo de la pagina (El fixed es un tipo de absolute) , por lo que sus dimensiones ya no cuentan para reordenar el resto de elementos.
Tendras que ponerle efectivamente un margin al side bar, o un transform, o un top , en fin, hay muchas formas de resolverlo
javiergalan87
Ah, ok, muchas gracias! Pensaba que estaba haciendo algo mal. El bien me lo pones entre comillas, supongo que se te ocurre una forma más limpia de hacerlo...
Usuario desconocido
Lo entrecomillo porque no estabas haciendo nada mal, es que css funciona asi.
Yo le subiria el z-index al top para que el sidebar corriera por abajo, y un padding-top al sidebar de la altura del header.
Pero en css siempre hay mil formas de hacer las cosas y muchas veces no son mejores unas que otras.
Y otra cosa, no utilices float para alinear a un lado u otro, para eso se usan otras cosas como text-align o flex , el float solo se utiliza cuando el texto (u otros elementos inline) deben rodear a un div o image.
Por ejemplo a top le pones float y no es necesario, tambien le pones display:block y tampoco hace falta porque los divs son block por defecto.
En fin, pegale una limpieza y quitale todo lo que no este haciendo nada.
javiergalan87
Gracias de nuevo! Probaré a ir haciendo estos cambios que me dices. La verdad es que aún me queda mucho por aprender jeje