Relative vs Absolute
Muy buenas a todos, en primer lugar deciros que estoy iniciandome en la maquetacion web y buscando solucion a un problema encontré este foro, el cual me ha gustado mucho.
Como ya he dicho estoy empezando a maquetar web, las tecnologías que uso son xhtml + css + php para intentar seguir los estandares web.
El primer problema que me encuentro es el siguiente:
Tengo una capa con posicion relativa en el documento, posicionada en el centro y con un ancho fijo:
div.main{
position: relative;
margin: 15px auto 0 auto;
heigth: auto;
width: 780px;
}
Luego esta capa anida a 3 capas mas, tambien con posicion relativa una para la cabecera, otra para el contenido y otra para el pie (el pie y la cabecera serán las mismas para toda la web por lo que los incluyo en dos documentos aparte y luego los llamo mediante php). El div contenido varia en funcion de la pagina que estemos visitando.
Las tres capas tienen como ancho el 100% de la madre y un alto variable en funcion del contenido:
div.cabecera{
position: relative;
width: 100%;
}
= para el contenido y para el pie.
Bien el problema empieza cuando trabajo dentro del contenido, si quiero posicionar diferentes div dentro de el no lo puedo hacer por posicion absoluta porque no se ajusta el ancho del contenido, entonces lo tengo que hacer con posicion relativa y jugando con el top, left, etc.
Que veis mas recomendable, trabajar con posicion relativa?? o absoluta ajustando el alto de la capa contenedora (lo cual limita mucho) ??
He leido en el foro acerca de todo esto y siguiendo enlaces externos pero siempre se ajustan a modelos de 2 o 3 columnas, por lo que no he podido aplicarlo a mi caso.
Muchas gracias de antemano y un saludo a todos.
breogan
Hola,
No me ha quedado claro que quieres hacer dentro del div contenido.
Como quieres posicionar los divs?
Yo tengo poca experiencia en esto también, pero creo que en este caso es mejor utilizar posicion relativa. En vez de utilizar top, left... has probado a utilizar margin y padding?
Saludos
zigotica
lo ideal es usar relative, asi que la pregunta clave es: ¿que necesitas exactamente para tener que usar absolute? dibujalo y lo muestras, a ver...
hartum
Yo tb lo he leido y como que no me he enterado de nada, un dibujo esuqematico seria lo suyo
pilgrem
Ante todo muchisimas gracias por responer tan pronto. Siento el cacao que he montao jejeje. Intentaré explicarlo mejor y ademas adjuntar un par de imagenes esquemas:
Bueno lo que veis en las imagenes es un boceto de como mas o menos tengo maquetada la web, la cabecera y el pie nunca cambian, por lo que los tengo en archivos externos que incluyo mediante php. Luego el interior de la capa contenido es lo que cambia en funcion de la pagina que estemos visitando. Explico mi duda:
Todas las capas tienen alto variable en funcion de lo que contengan dentro (imagenes, texto, etc), Si en la capa contenido anido mas capas como se muestra en la figura 2 y estas tienen posicion absoluta, la capa contenido no estira para abajo, por lo que se solapan las div. En cambio si posiciono la capa anidada con posicion relativa, la div contenido si estira para abajo pero para darle la posicion tengo que andar jugando con espacios reservados (margin y padding) cosa que no me gusta, ademas de ser relativamente mas dificil de posicionar correctamente que las capas absolutas (en las cuales indicas solo un left y un top).
Si voy mas ayá cuando quiera posicionar otra capa con imagen o varias con imagenes estoy con la mimsma duda absolute o relative???
Bueno espero no haberos liado mas aun y que entendais mi duda para poder ayudarme. Muchas gracias de nuevo a todos.
zigotica
necesitarás un poco de práctica (y leer en inglés), pero la respuesta está aquí:
http://css.maxdesign.com.au/floatutorial/
suerte
pilgrem
Buenas zigotica, practica sobre todo, ya te digo, es mi primera maquetacion con capas y css, Gracias por el enlace lo miro ahora mismo