Css doesn’t apply to content with jQuery $.ajax

[arkader]

Hi Everyone,

Here is my issue,
I have created a template with handlebars.js and i would like to fetch the data from a json file. So far, it works, my trouble is that my css doesn’t apply to my template and events don’t work too (mouseenter, mouseleaver …)
The css is well included on the same page.

Here is my js file : http://pastebin.com/AcUmYZvf
my template : http://pastebin.com/D2hhXJKy
and here is my website : http://emalsaifi.com/purprodv1/productions.php

For instance, the images with BANE should be 320px by 320px.

Can someone help me plese ? :)
And sorry for my poor english

[TheDoc]

You have a fixed height on your `#productions` div, that’s what’s causing the images to be cut off.

Your CSS is being applied fine.

[arkader]

Hi @TheDoc,

Thank you for your answer.
Indeed, when i look with chrome developer tool, my div#productions is set to 88px,
but that’s weird because i have never set that height on my css stylesheet.

I have to tried to set it to auto, on my css, but it doesn’t change anything.
If I change it on my js file with :

$(‘#productions’).css(‘height’,’auto’);

it works, but it’s messy.

Do you have a clean way to deal with this ?
And do you know why is the height set to 88px ?

Thanks a lot :)

[Mottie]

@arkader I see a “style.css” file at the very bottom of the page, try moving it to the top of the document (in the head).

[arkader]

Thank you Mottie,

I forgot to put it back, now it’s better.

[Author]

Posts