CSS laddas eller appliceras inte i IE8 beroende på ordningen den importeras

Först och främst; Varför i allsin dar länkar du in alla css-filer så där? :)
Får du samma resultat om du har all css i en och samma fil?

Hur blir det om du skriver såhär:

.dfliknav a:hover,
#dmeny a:hover,
a:hover
{ cursor: hand !important; cursor: pointer !important; }

.dfliknav a,
#dmeny a,
a
{ cursor: hand !important; cursor: pointer !important; }

… Det borde kunna sammanfattas med
a{cursor:hand; cursor:pointer;}

(gamla IE ska föredra hand tror jag)

Palle skrev:

Först och främst; Varför i allsin dar länkar du in alla css-filer så där? :)
Får du samma resultat om du har all css i en och samma fil?

Det verkar funka om jag slänger in allt i en enda stor css-fil. Är det någon känd begränsing i IE att den inte klara att importera många css-filer?

Egentligen har jag bara en css-fil som länkas in i html-dokumentet, men den i sin tur importerar de anda med @import först i den filen. Jag spekulerade om det är nåt med @import som gjorde att IE inte funkade och importerade var för sig explicit i html-filen.

Jag vill verkligen undvika att lägga all CSS i samma fil. Den blir i så fall dryga 1200 rader nu och känns inte som ett bra sätt att ordna sin css.

stephan skrev:

Det verkar funka om jag slänger in allt i en enda stor css-fil. Är det någon känd begränsing i IE att den inte klara att importera många css-filer?

Egentligen har jag bara en css-fil som länkas in i html-dokumentet, men den i sin tur importerar de anda med @import först i den filen. Jag spekulerade om det är nåt med @import som gjorde att IE inte funkade och importerade var för sig explicit i html-filen.

Jag vill verkligen undvika att lägga all CSS i samma fil. Den blir i så fall dryga 1200 rader nu och känns inte som ett bra sätt att ordna sin css.

Du behöver ju inte ha allt i samma css-fil, dock kan du försöka dela upp dem med med någon annan sorts logik.

Ex. dela upp dem i tre stycken:

 spar-sida.css
 spar-widget.css 
 spar-genrell.css

Det är bättre att ha en stor eller åtminstone ett fåtal lite mindre filer än att ha jättemånga små. Der ger minskade laddningstid med få stora än måånga små (vi slipper göra många vändor till servern för att hämta filerna).

Sedan kan du minifiera dem, så blir det färre rader, dvs, en css-style per rad eller vad jag skall kalla det.

Följande:

.spar-widget-Urvalsparametrar .alder .alderAlder .gwt-TextBox {
	width: 3em;
	margin-right: 1em;
}

.spar-widget-Urvalsparametrar .alder .relationAlder .gwt-TextBox {
	width: 3em;
	margin-right: 1em;
}

Detta blir då:

.spar-widget-Urvalsparametrar .alder .alderAlder .gwt-TextBox { width: 3em;margin-right: 1em;}
.spar-widget-Urvalsparametrar .alder .relationAlder .gwt-TextBox {width: 3em;margin-right: 1em;}

rader som:

.spar-widget-Urvalsparametrar .alder .alderAlder {
	width: 600px;

}
.spar-widget-Urvalsparametrar .alder .fodelsetid {
	width: 600px;
}

kan skrivas som:

.spar-widget-Urvalsparametrar .alder .alderAlder,
.spar-widget-Urvalsparametrar .alder .fodelsetid { width: 600px; }

I och med att det är inget som skiljer dem åt, och därmed behöver du inte skilja dem åt i ytterligare ett eget block.

Detta ger ytterliggare lite mindre laddningstid och gör det kanske lättare att underhålla i slutändan.

:)

Många bra förslag på förbättringar, men jag kan tyvärr inte slå ihop CSS-filerna. Om det nu är så att det inte går att komma förbi detta IE-problem så måste jag hitta en annan lösning.

Är det någon som känner till något ramverk i java som kan slå ihop css-filer på serversidan och få dem att se ut som en utåt?

Tittar just nu på lite andra lösningar, men så länge så slängde jag ihop en java-servlet som gör jobbet, och det verka funka i IE nu också.

package com.mywebapp.servlets;

import java.io.IOException;
import java.io.InputStream;
import java.util.ArrayList;
import java.util.Set;
import javax.servlet.ServletConfig;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class CSSServlet extends HttpServlet {
    
    private static final long serialVersionUID = 1L;
    private ArrayList<Character> c;
    
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        ServletOutputStream out = resp.getOutputStream();
        for(Character character : c) {
            out.print(character.charValue());
        }
    }
    
    @Override
    public void init(ServletConfig config) throws ServletException {
        super.init(config);
        c = new ArrayList<Character>();
        
        ServletContext ctx = config.getServletContext();
        
        Set csser = ctx.getResourcePaths("/stilmallar/lokal/");
        
        for(Object o : csser.toArray()) {
            if(o.toString().contains("spar-")) {
                InputStream in = ctx.getResourceAsStream(o.toString()); 
                int nextChar;
                try {
                    while ((nextChar = in.read()) != -1) {
                        Character nextCharacter = new Character((char) nextChar);
                        c.add(nextCharacter);
                    }
                } catch (IOException e) {
                    // log error
                }
            }
        }
    }
}