Sé cuál es la posición absoluta y relativa, pero algunos puntos aún no me son aclarados. para referencia
css:
.rel{ position:relative; background:red; } .abs{ position:absolute; background:blue; } html:
rel abs
ahora los puntos son:
relativa div toma 100% de ancho automáticamente pero div absoluta solo toma ancho de contenido. ¿por qué?
cuando doy la altura al 100% no hay ningún efecto en el div relativo, pero el div absoluto toma el 100% de altura. ¿por qué?
cuando doy margen-top: 30px es shift div absoluto también pero cuando doy top: 30px entonces solo cambio relativo div. ¿por qué?
cuando no doy la top:0 , left:0 a la div absoluta que es superior a la altura de div. ¿por qué?
position:absolute configuración position:absolute elimina el elemento en cuestión del flujo normal de la estructura del documento. Entonces, a menos que establezcas explícitamente un ancho, no sabrá qué tan ancho es. puedes establecer explícitamente el width:100% si ese es el efecto que buscas.
Un elemento con position:relative en su conjunto se comporta de la misma forma que una position:static normal position:static elemento position:static hace. Por lo tanto, establecer la height:100% no tendrá ningún efecto a menos que el elemento principal tenga una altura definida. Por el contrario, los elementos posicionados absolutos se eliminan del flujo de documentos, por lo que son libres de ajustarse a la altura que tenga actualmente su elemento contenedor.
Es probable que esto tenga algo que ver con los elementos principales en su HTML, pero no puedo ayudarlo a menos que proporcione el HTML y el CSS completos de su página.
El valor predeterminado de las propiedades superior e izquierda es automático. Esto significa que el navegador calculará estas configuraciones por usted y las establecerá donde se representaría el elemento si no tuviera una position:absolute .