Ordenar archivo css

[rodrypaladin]

Hola a todos, ayer mismo adquirí un script que hoy me he dado cuenta que el archivo css está tan desordenado que es imposible encontrar algo, cuando inspecciono en el navegador, al estar tan desordenado no me dice en que linea está exáctamente el stilo que quiero modificar, mire lo que mire me dice que está en la linea 1.

Lo curioso es que funciona perfectamente, pero está tan desordenado que me está costando muchísmo encontrar todo lo que quiero... sabéis si hay alguna herramienta o aplicación que pueda ordenarlo ???

Mil gracias a quien conteste

[emprear]

no creo que ya nada tan específico, lo vas a tener que hacer en forma manual, podés ayudarte quizás con alguna extensión del navegador, yo en particular utilizó Webdeveloper en Firefox


Saludos

[rodrypaladin]

Si te digo la verdad, no sabría como hacerlo manual, de saberlo, aunque me costara 2 o 3 horas lo haría la verdad...pero no se ni por donde empezar

[pitufoweb]

la mayoría de los editores tienen un comando para ordenar el código.

Por ejemplo:

En NetBeans; vas a Source -> Format
En Dreamweaver vas a Format Source Code -> Apply Source Formatting

Estos comandos ordenan e indentan el código de forma automática.


P.D No estoy seguro si es esto lo que esta buscando :p .


Saludos

[emprear]

@rodrypaladin
Pasá la url y veo si te ouedo orientar

@pitufoweb
hace siglos que no uso software de diseño, primero convengamos en que se denomina ordenar (o que se considera confuso si se quiere), yo generalmente ordeno mi css siguiendo el orden, en la medida de lo posible, del html.

Supongamos que tenes (ejemplo sencillo)

div header
div contenido
div pie

yo haría mi css con

body{
}
.header{
}
.contenido{
}
.pie{
}


si eso está mezclado, el dreamweaver te lo ordena?

Saludos

[pitufoweb]

Hola emprear.

Tal ves no comprendo bien el problema de @rodrypaladin.

Por lo que yo entendí, es que el código CSS esta "minificado" o algo así, y por lo tanto el código esta en una sola linea. Entonces si por ejemplo tratas de validar el código y el validador te dice que hay un error en tu código, siempre te dirá que el error esta en la linea #1. Entonces la función del editor lo que haría es que pondrá a cada regla en su propia linea.



Algo asi:

boby {...} .header {...} .contenido{..} .pie{...}



Y despues de "formatearlo" quedaría algo así:

body {
...
}

.header {
...
}

.contenido {
...
}

.pie {
...
}





Saludos.

[emprear]

bueno, puede ser, es que yo no asocié desordenado con minificado, aparte algunos minificadores de css, también lo comprimen asociando reglas, debería tener cuidado si ese es el caso, sobre todo si dice que le funciona correctamente.
Si pasa algún código sería mejor.
Y supongo también que debe de ser mucho mas complejo el css que el ejemplo que puse
Saludos

[rodrypaladin]

Hola chicos, al final tomé el camino más dificil, ir buscando donde terminan las } e ir cambiandolo de linea, efectivamente estaba todo en la misma linea, por eso me decia que todo estaba en la linea uno, pero por fin lo he podido solucionar!!!

[metacortex]

En la próxima oportunidad usa algo como esto: http://procssor.com/ o http://www.codebeautifier.com/

[emprear]

Iniciado por rodrypaladin

Hola chicos, al final tomé el camino más dificil, ir buscando donde terminan las } e ir cambiandolo de linea, efectivamente estaba todo en la misma linea, por eso me decia que todo estaba en la linea uno, pero por fin lo he podido solucionar!!!

Ahora comprendo, pero te aclaro que eso no es necesariamente "desorden", es optimización, una vez que tengas el css final, podés volverlo a minimizar.

Saludos