La mayoría de las etiquetas de estructura son de tipo... block inline.
Las etiquetas < li > son de tipo... block inline.
Qué línea hay que añadir a ese código CSS para que las etiquetas < li > se muestren en horizontal?
display:inline;
presentation:inline;
.
Cómo hago que esa barra lateral (< aside >...< /aside >) [que está en color verde] pase de estar arriba a estar en la izquierda?
el código CSS de la imagen es:
#barralateral {
background-color:#0F0;
}
hay que añadir float:left; al código CSS hay que añadir dir:left; al código CSS.
En CSS la propiedad ... rompe el flujo de colocación predeterminada de los elementos de una página web, además el elemento ya no ocupará el 100% del ancho de la pantalla, sino que ocupe el ancho correspondiente al texto y además los elementos de debajo se van a situar al lado de ese elemento y rodeando a ese elemento float dir.
Cómo hago que esa barra lateral (< aside >...< /aside >) [que está en color verde] no sea rodeada por el siguiente contenido de la página web?
el código CSS de la imagen es:
#barralateral {
background-color:#0F0;
float:left;
}
hay que añadir height:830px; al código CSS
hay que añadir width:830px; al código CSS
.
Una etiqueta de tipo block en el modelo caja contendedor: ocupa el 100% del ancho de la página web ocupa el 50% del ancho de la página web.
La propiedad margin...
deja un espacio arriba, abajo, a la izquierda y a la derecha respecto de los márgenes de la página web o de las otras cajas-contenedor
deja un espacio a la izquierda respecto del margen izquierdo de la página web o de una caja contenedor que esté a la izquierda
.
Las propiedades margin-top, margin-bottom, margin-left y margin-right
dejan respectivamente un espacio arriba, abajo, a la izquierda y a la derecha respecto de los márgenes de la página web o de las otras cajas-contenedor
dejan todas un espacio a la derecha respecto del margen derecho de la página web o de una caja contenedor que esté a la izquierda
.
Si tenemos una barra lateral flotante a la izquierda y una sección a la derecha, si uso un margin-left con pocos píxeles en la sección aparentemente no pasa nada, ¿por qué?
porque la barra flotante es como si no estuviera y realmente se está haciendo el margin-left desde el borde izquierdo de la página web, habría que hacer un margin-left con muchos más píxeles, o bien en la barra flotante hacer un margin-right
porque para que funcione hay que usar adicionalmente la propiedad index
.
La barra lateral verde flotante es rodeada por el pie de página, ¿cómo hacemos para que el pie de página rompa la flotabilidad de la barra y se comporte como una caja-contenedor normal?
en el código CSS de la barra lateral ponemos clear:left;
en el código CSS de la barra lateral ponemos clear:right;
.
|
