Question

I am developing an enterprise application using Spring, Java, JSPs, Tiles, and JQuery. I have several tabs that need a particular css file. Each Tab corresponds to a JSP. The JSP that needs the css file has the css include in it. The problem I have is that once I load a css file needed in tab/jsp Foo, that css file is still active when I click on tab/JSP bar. How do I make sure that when a user clicks on the jQuery tab, that all the css files from the previous tab/jsp are removed? When I hit refresh, the problem disappears, is there a way to refresh automatically?

Answer 1

Simply adjust your CSS targets to be tab specific:

.tab-about h2 {
    /** ... **/
}

.tab-about p {
    /** ... **/
}

.tab-home h2 {
    /** ... **/
}

.tab-home p {
    /** ... **/
}