elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Introducción a Git (Primera Parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Problemas con css: position:absolute; (Solucionado)
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Problemas con css: position:absolute; (Solucionado)  (Leído 5,912 veces)
Zeroql


Desconectado Desconectado

Mensajes: 957


Todo lo k sucede sucede por una razon


Ver Perfil WWW
Problemas con css: position:absolute; (Solucionado)
« en: 2 Noviembre 2011, 17:34 pm »

Buenas,Bueno el problema consiste en que necesito el div superior estático y coloque el div header con position:absolute, hasta ahi normal,
pero los otros divs que estan posicionados debajo de este no responden bien a la posición del header
estos divs suben y se pierde texto, aqui les dejo el enlace de como quedan

http://sovys.260mb.com/

y asi es el diseño si no se tiene el header estatico

http://sovys.260mb.com/prueba.html

como puedo solucionar este inconveniente????

de ante mano les agradezco la ayuda presentada.


« Última modificación: 3 Noviembre 2011, 14:52 pm por Zeroql » En línea

Dime y lo olvido, enseñame y lo recuerdo, involucrame y lo aprendo.
/.-ZEROQL.-\   -----  #937675#

Spider-Net


Desconectado Desconectado

Mensajes: 1.165


Un gran poder conlleva una gran responsabilidad


Ver Perfil WWW
Re: Problemas con css: position:absolute;
« Respuesta #1 en: 2 Noviembre 2011, 20:02 pm »

¿Has probado a ponerle un padding-top: 15px; a los div de abajo?


En línea

Roboto


Desconectado Desconectado

Mensajes: 581



Ver Perfil WWW
Re: Problemas con css: position:absolute;
« Respuesta #2 en: 2 Noviembre 2011, 20:25 pm »

Código:
#header {
    background: none repeat scroll 0 0 #F4F4F4;
    border-bottom: 1px solid #666666;
    color: #FFFFFF;
    height: 100px;
    position: fixed;
    width: 100%;
}

ese es el codigo del div
En línea

Zeroql


Desconectado Desconectado

Mensajes: 957


Todo lo k sucede sucede por una razon


Ver Perfil WWW
Re: Problemas con css: position:absolute;
« Respuesta #3 en: 2 Noviembre 2011, 23:59 pm »

Código:
#header {
    background: none repeat scroll 0 0 #F4F4F4;
    border-bottom: 1px solid #666666;
    color: #FFFFFF;
    height: 100px;
    position: fixed;
    width: 100%;
}

ese es el codigo del div

Si ese esl colde. pero el div que le sige que esl container no queda debajo del header. igual ahi deje los 2 ejemplos
En línea

Dime y lo olvido, enseñame y lo recuerdo, involucrame y lo aprendo.
/.-ZEROQL.-\   -----  #937675#

Spider-Net


Desconectado Desconectado

Mensajes: 1.165


Un gran poder conlleva una gran responsabilidad


Ver Perfil WWW
Re: Problemas con css: position:absolute;
« Respuesta #4 en: 3 Noviembre 2011, 02:09 am »

Yo insisto: ¿Has probado a ponerle un padding-top: 15px; a los div de abajo?

Incluso si no es suficiente, pues padding-top:35px; (o lo que sea necesario) tanto a "colizq" como a "colder" y listo.
« Última modificación: 3 Noviembre 2011, 02:11 am por Spider-Net » En línea

Zeroql


Desconectado Desconectado

Mensajes: 957


Todo lo k sucede sucede por una razon


Ver Perfil WWW
Re: Problemas con css: position:absolute;
« Respuesta #5 en: 3 Noviembre 2011, 13:57 pm »

Spider-Net gracias por tu colaboración.
pero he notado que cuando uno coloco la posición fixed, el div se convierte en div flotante, la solución mas sencilla que veo es crear otro div vacio con el height del header. nose me parece mas sencillo asi

En línea

Dime y lo olvido, enseñame y lo recuerdo, involucrame y lo aprendo.
/.-ZEROQL.-\   -----  #937675#

~ Yoya ~
Wiki

Desconectado Desconectado

Mensajes: 1.125



Ver Perfil
Re: Problemas con css: position:absolute;
« Respuesta #6 en: 3 Noviembre 2011, 14:46 pm »

Bueno espero que te funcione esto, lo he probado antes en localhost....

Código
  1. .colizq {
  2.    float : left;
  3.    margin-top : 100px;
  4.    padding-bottom : 10px;
  5.    padding-left : 10px;
  6.    padding-right : 10px;
  7.    padding-top : 10px;
  8.    right-color : #E2E2E2;
  9.    right-style : dashed;
  10.    right-width : 2px;
  11.    width : 75%;
  12.  }
  13.  
  14.  
  15. .colder {
  16.    float : right;
  17.    margin-top : 100px;
  18.    padding-bottom : 10px;
  19.    padding-left : 10px;
  20.    padding-right : 10px;
  21.    padding-top : 10px;
  22.    width : 20%;
  23.  }
  24.  


Saludos.
En línea

Mi madre me dijo que estoy destinado a ser pobre toda la vida.
Engineering is the art of balancing the benefits and drawbacks of any approach.
Zeroql


Desconectado Desconectado

Mensajes: 957


Todo lo k sucede sucede por una razon


Ver Perfil WWW
Re: Problemas con css: position:absolute;
« Respuesta #7 en: 3 Noviembre 2011, 14:52 pm »

~ Yoya ~ gracias ya lo intente asi tambien inclusive en el container ya que puedo agregar mas divs antes de las cols, pero no me dio
la sulucion de crea otro div antes me ha funcionado de maravilla. me quedo con esa:

la solucion fue:
Código
  1. #header {
  2.    background: none repeat scroll 0 0 #F4F4F4;
  3.    border-bottom: 1px solid #666;
  4.    color: #FFF;
  5.    height: 100px;
  6.    position:fixed;
  7.    width: 100%;
  8. }
  9.  
  10. #head_empty {
  11.    height: 100px;
  12.    width: 100%;
  13. }
  14.  
En línea

Dime y lo olvido, enseñame y lo recuerdo, involucrame y lo aprendo.
/.-ZEROQL.-\   -----  #937675#

Spider-Net


Desconectado Desconectado

Mensajes: 1.165


Un gran poder conlleva una gran responsabilidad


Ver Perfil WWW
Re: Problemas con css: position:absolute; (Solucionado)
« Respuesta #8 en: 3 Noviembre 2011, 14:58 pm »

Spider-Net gracias por tu colaboración.
pero he notado que cuando uno coloco la posición fixed, el div se convierte en div flotante, la solución mas sencilla que veo es crear otro div vacio con el height del header. nose me parece mas sencillo asi



Yo probé en local poniéndole el padding-top a las dos columnas y la verdad es que funcionó perfectamente. Pero igual si ya has encontrado alguna solución, me alegro :)
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
problemas con fechas(Solucionado)
Programación Visual Basic
Zeroql 1 1,187 Último mensaje 30 Noviembre 2007, 20:03 pm
por Zeroql
Capa con positon absolute al centro
Desarrollo Web
Riki_89D 1 2,179 Último mensaje 8 Enero 2011, 22:46 pm
por madpitbull_99
[solucionado]problemas con mid vb.net
.NET (C#, VB.NET, ASP)
CH4ØZ 3 4,842 Último mensaje 1 Febrero 2011, 01:43 am
por CH4ØZ
Proyecto Absolute MMORPG ? « 1 2 »
Foro Libre
PressKeyToRestart 13 6,430 Último mensaje 22 Septiembre 2013, 16:51 pm
por z3nth10n
Drupal For Absolute Beginners
Tutoriales - Documentación
ehn@ 0 1,220 Último mensaje 3 Diciembre 2023, 20:06 pm
por ehn@
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines