Notepad++ - CSS alles in einer reihe soll normal werden ?

    Hallo,
    kennt jemand einen Trick (am besten mit Notepad++) wie man die CSS Datei wieder leselich machen kann ?

    Normalerweise sehen die Datei bzw der Code so aus

    Code
    .test {
	background-repeat: repeat-x;
	border-bottom: 5px solid #327ab2;
	}

    bei mir sieht er aber so aus

    Code
    .test {background-repeat:repeat-x;border-bottom: 5px solid #327ab2;}

    das liegt nicht am UTF8 ohne Bom.

    und das ebend alles in einer reihe hintereinander weg :-??

    Mit Suchen und Ersetzen.

    Suche nach: ;
    Ersetzen durch: ;\r\n\t

    und Suchmodus auf Eweitert stellen.


    \r\n -> ist das unter Windows übliche Zeilenendeformat, evtl. nur \n verwenden (passend zum Originalformat der Datei).

    Zitat von Dato

    Normalerweise sehen die Datei bzw der Code so aus

    Code
    .test {
	background-repeat: repeat-x;
	border-bottom: 5px solid #327ab2;
	}

    Du meintest sicher:

    Code
    .test {
    background-repeat: repeat-x;
    border-bottom: 5px solid #327ab2;
}

    Funktional macht das natürlich keinen Unterschied, aber die Einrückung oben ist Chaos. ;)

    In Notepad++:

    Menü → Edit → EOL conversion → Windows Format

    In UltraEdit:

    Menü → Datei → Konvertieren → Unix/Mac nach DOS

    Je nach Editor schon. Notepad (der Windows-Editor) zeigt bei Unix-Line-Endings keinen Zeilenumbruch an. Die CSS-Datei von getbootstrap muss nur auf die von mir beschriebene Weise konvertiert werden. Und dann werden die Zeilenumbrüche auch in Notepad angezeigt. Mit Suchen und Ersetzen geht es natürlich auch.

    In UltraEdit wechsele ich manchmal in den Hex-Modus, um zu sehen, um welche Escape-Sequenzen es sich handelt. Irgendwann war es mal vorgenommen, dass die gemischt waren. Ich glaub, das Problem hatte ich im Zusammenhang mit einem Python-Suchen-und-Ersetzen-Script.

    Zitat von kyou


    Je nach Editor schon. Notepad (der Windows-Editor) zeigt bei Unix-Line-Endings keinen Zeilenumbruch an. Die CSS-Datei von getbootstrap muss nur auf die von mir beschriebene Weise konvertiert werden. Und dann werden die Zeilenumbrüche auch in Notepad angezeigt. Mit Suchen und Ersetzen geht es natürlich auch.


    Entschuldige, aber da hakt es bei dir. :wink:
    In einem komprimierten CSS-File mit Code vergleichbar mit diesem...

    Code
    html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}*,:before,:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}


    ...werden die Deklarationen oft in einer Zeile zusammengefasst. Da gibt es also keinen unnötigen Zeilenumbruch. Das gilt für jedes System und daran kann logischerweise auch eine EOL-Funktion nichts ändern.

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

    Okay. ";" durch ";\n" oder ";\r\n" zu ersetzen, reicht aber nicht. Vielleicht gibt es auch ein fertiges Makro für Notepad++, um das Problem zu lösen, wenn man das von dir genannte Online-Tool nicht nutzen will. Oder man schreibt sich selbst ein Makro.

    Im Fall der Datei "bootstrap.min.css" wäre es am Einfachsten, die Datei "bootstrap.css" in "bootstrap.min.css" umzubennen, falls beide gebraucht werden. Bootstrap.min.css ist die komprimierte bootstrap.css, wenn ich das richtig sehe.

    Hier ist noch ein Online-Tool zum Deminimieren:

    http://unminify.com/

    -----------------------------------

    Hier findest du zwei fertige Makros, eins zum Minimieren, eins zum Deminimieren bzw. Formatieren:

    https://stackoverflow.com/questions/1183…css-for-notepad

    (Nicht am Titel des Threads stören. Es geht nicht darum, den Code zu validieren.)

    Natürlich genügt das nicht. Deshalb habe ich auch weiter oben das Beautifier-Tool vorgeschlagen. Es gibt etliche dieser Tools - ich habe lediglich das erstbeste gewählt, das mir in der Suchmaschine angezeigt wurde. Es gibt richtige Luxus-Tools mit Optionen und allem Schnickschnack. Warum sollte ich mich da also mit einem Makro abmühen? In der Regel möchte man sowieso wohl eher sein CSS komprimieren. ;)
    Wie kommst du eigentlich auf die bootstrap.css? Von der war doch hier nie die Rede... :)

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

    Ah. Jetzt. Ja. Eine Insel ... :P
    Nö, den habe ich mir gar nicht mehr angeschaut, weil die Lösung eigentlich schon klar war.
    Und natürlich schaut die bootstrap.min.css so aus. Wenn man das nicht möchte, gibt es auch noch die normale Version, wenn mich nicht alles täuscht. :)

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)