Frustrating CSS Issue?

Hi there,

I have a jQuery plugin on my side that’s use for filtering list items.

The trouble is, during the ‘filtering’ my li elements get pinned to the left side of the page, and I have no idea what’s causing it.

I’ve eliminated it being a markup or javascript problem, so it only leaves CSS as being the culprit, but I’ve yet to pin down issue.

There’s a fair bit of CSS involved in the styling, so I’ll avoid pasting it all here.

It’s supposed to function like:

Many Thanks.

Hi Cined. Welecome to SitePoint. :slight_smile:

I’m lost. What’s the problem? I don’t see anything similar between those two pages, so I can’t see what the problem is. What are you expecting to see?

At the moment, when a filter item is clicked, the divs get pinned to the left side of the page and group together.

The other example I posted is how it’s supposed to look. It’s exactly the same plugin.

Which are the filter items we are meant to click on? Nothing happens when I click on anything on your page.

Click the items next to the word ‘Filter’.

Apparently, It had something to do with my using ID’s to select elements.

I re-read the documentation again, and under the ‘CSS Recommendations’ is suggests using classes instead.

A little hack-ish, but at least it works now! Thanks.

Still nothing happens for me. I see that some js files are linked to localhost:8888. You need to put those online.

Ah, that would explain why it was working for me and not you :slight_smile:

I’ve fixed the links now.

Yep, now it’s working. Glad you found a solution to it. :slight_smile: