Grave problema de CSS

Platanium

Buenas, tengo un grave problema con un proyecto que tengo hecho. El proyecto consiste en una pagina web en HTML y PHP.

El problema esta en que los CSSŽs que tengo para cada HTML uso pixeles como propiedad (width, height, margin, etc) y si cambio de resolucion a ser en pixeles todo se me mueve. Se que tengo que cambiar todo a porcentaje o eso creo. Alguien sabe una manera rapida de hacer esto ya que tengo muchisimos CSS y cada css esta repleto de propiedades con pixeles.

Gracias!

Puni

conversores de px a em online tienes a porrillo
http://pxtoem.com/
si buscas una herramienta que lo haga automáticamente no sabría decirte

Platanium

Pero como hace el calculo sin saber la resolucion de pantalla? Porque creo que si por ejemplo yo uso una resolucion de 800x600 necesitaria que me calculase el porcentaje para esta resolucion.

eXtreM3

Las dimensiones no dependen de la resolucion, dependen del contenedor. Y a su vez el contenedor sí depende de la resolucion, que ira en %

Merkury

Solución rápida: envuelve toda la web con un div que como propiedad tenga widht: 100% y ya dentro tus cosas en pixeles (hacerlo con % es una locura eh)

1 respuesta
Esmoris

#5 +1

La de tiempo que me solucionó cuando estaba aprendiendo xD
Intenta siempre tener un contenedor principal al cual le aplicas un width 100% , para que cuando redimensiones te lo haga sin problemas.

Por cierto en google Chrome tienes una opción muy interesante para ver las correcciones de css.
Consiste en que cuando abres tu página haces click derecho sobre el objeto que quieras , y t salen las propiedades del div seleccionado y lo puedes modificar para mirar a tiempo real como quedaría , dspués solo tiens que copiar el código modificado y aplicarlo a tu css.

Te dejo link de un video que te explica como funciona :

http://www.youtube.com/watch?v=3ttyDbBK2TM

Igual te interesa :)

saludos!

1 respuesta
Weahl

#6 Más sencillo que eso, en Firefox, pulsas SHIFT + F7 y...¡MAGIA! Puedes cambiar CSS mientras ves como se va moviendo todo mientras escribes.

Es una opción de firefox que me ha solucionado la vida.

1 respuesta
SicKneSs

#7 hay algo parecido en Chrome ?

3 respuestas
Weahl

#8 Pues que yo sepa no, así que a usar Firefox :P

Fyn4r

#8 busca en herramientas algo como "herramientas de desarrollador" o algo así, no recuerdo no lo tengo instalado :S

P.D En IE9 es con F12

1 respuesta
Weahl

#10 Joder, la opción que has comentado de IE también es buenísima, porque también puedes ver como se ve la página con IE8 e IE7.

#8 Y para Chrome acabo de comprobarlo y también se puede hacer, simplemente Ctrl + Shift + I, te vas a Resources, abres la carpeta de la web, y buscas las hojas de estilo, y profit.

Usuarios habituales

  • Weahl
  • Fyn4r
  • Esmoris
  • Merkury
  • eXtreM3
  • Platanium
  • Puni