HTML5 and CSS

I have a problem that's been bugging me. The error shows in Chrome not Mozilla.
The website is here if you want to look: www.topshops.com.au
The website pages look good except for the 'store_listings-generic page where the isotope is. The store listings page on loading has the 4 coloumns like it should and then when you select a category from the filter tabs it goes into 3 columns and mucked up.
Attachment 33457
I am positive it applies to the CSS somehow and I am getting this error below:

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://www.topshops.com.au/css/colors/".
sorting.js:11 Uncaught TypeError: Cannot read property 'toLowerCase' of undefined
jquery.isotope.min.js:11 cannot call methods on isotope prior to initialization; attempted to call method 'reLayout'

In the css/color folder all the css files are css.
These are the link to my css files in the head area.

Code:

---

<link rel="shortcut icon" href="images/favicon.ico">
        <link href="css/bootstrap-theme.min.css" rel="stylesheet" type="text/css" />
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="css/prettyPhoto.css" rel="stylesheet" type="text/css" />
        <link href="css/flexslider.css" rel="stylesheet" type="text/css" />
        <link href="css/animate.css" rel="stylesheet" type="text/css" media="all" />
        <link href="css/style.css" rel="stylesheet" type="text/css" />
        <link href="css/colors/" rel="stylesheet" type="text/css" id="colors" />

---

Another thing I should mention is that if I rename the websites folder to another name all gets corrected, but when I change it back to the websites name it all goes askew again.
Also if I change the index.html page to another name it corrects itself and when I call it index.html it goes askew again.
I hope you can understand my problem and it makes sense. This is doing my head in.:sick:

Quote:

---

TypeError: undefined is not an object (evaluating 'parts[1].toLowerCase')

---

The debugger tells you exactly what's wrong. You're calling upon the variable parts when it is not yet initialized. I'm guessing you're trying to split it into an array but in this case, the delimiter is not found therefore parts won't be a valid array.

As for...

Quote:

---

cannot call methods on isotope prior to initialization; attempted to call method 'reLayout'

---

It too is attempting to reference an object that has not yet been created and therefore will fail. Try referencing the isotope JS file after all others.

Quote:

---

Originally Posted by PeejAvery

The debugger tells you exactly what's wrong. You're calling upon the variable parts when it is not yet initialized. I'm guessing you're trying to split it into an array but in this case, the delimiter is not found therefore parts won't be a valid array.

As for...



It too is attempting to reference an object that has not yet been created and therefore will fail. Try referencing the isotope JS file after all others.

---

Hi PeejAvery, Thanks for your response.
I looked into the files and can't find any errors. (below is the code for that 1st error) I tried referencing the the isotope js after other files and it made no difference.

Code:

---

(function(){
                var search = window.location.search.slice(1),
                        items = search.split('&');
                items.forEach(function(item,index){
                        var parts = item.split('=');
                        queryParams[parts[0]] = parts[1].toLowerCase();
                });
        }());

---

You know what's weird?. I have this exact website ( exact same files) in another folder called 'test ' and it's working perfect and its working fine on my local machine.
See here:http://www.kinectwebdesign.com/test/...s_generic.html

Its like a file from somewhere is connected wrong and when the folder name gets changed to www.topshops.com.au it starts acting up.
Also I notice that the headings on the store listings look different as if they are not getting the correct css?????

Any chance you are messing with .htaccess causing incorrect directory listing for referenced files?

Quote:

---

Originally Posted by PeejAvery

Any chance you are messing with .htaccess causing incorrect directory listing for referenced files?

---

I have not dabbled with the .htaccess file. I searched on my cpanel and there seem to be some htaccess files related to an installation of wp and some others for zencart.
This is a bootstrap site I did and as far as I know there is no .htaccess file that I created for this website.
In all honesty I don't know much about htaccess files, I did do some quick reading and opened a few of them on the server and they all seem to be ok and related to their respective sites.

I am ready to start removing all other sites off the server till I find the culprit.
Thanks for your suggestions so far.

Other things I have recently tried are writing absolute paths on the index.html and store_listings_generic.html pages to the css and js files but it doesn't make a difference.

Every content management site deals with .htaccess. Since it works fine when the only difference is a renamed folder, that is what would make me think that .htaccess is causing file redirection.

Quote:

---

The error shows in Chrome not Mozilla.

---

Just for info, it also works OK in IE 11.

Quote:

---

Originally Posted by 2kaud

Just for info, it also works OK in IE 11.

---

Thanks for letting me know that.

I have checked .htaccess files and deleted each website on my host one by one but it made no difference.
My host says both websites look identical to them, which is even more boggling.
Two other people can see the error like I do.

I have deleted my cache and flushed dns. I am thinking of putting a redirect on so it goes to the website in the test folder.

I still have not found a solution.