I am using Contao, which I am unfamiliar with, to make a website for my boss, and now it is published I can get it to work on every browser except IE 6 and 7. The images are coming out all misshapen... Open www.carolineredmanlusher.com in IE6/7 to see what I mean!

I think it's due to IE 7 not parsing the float property and margins/padding as well as the newer browsers do, I've been told I should be able to get round it with one extra style sheet and then add an 'if' statement to the header on each page, but I really don't know how to do this (and I am the WHOLE IT department - there's no one to show me how!

Please would someone explain, really simply, how to download the bit of CSS I need from Contao, the exact code I need to add to it, and exactly where I need to add it? I am learning on my feet here!

Have you tried defining a pixel width for your floated elements? If I'm not mistaken, in older IE version you had to specify a width for your floated elements and the elements that were to move in beside the float.

If you want to go the IE 6/7 stylesheet way add this code to your page headers:

<!--[if lte IE 7]>
// add your link that points to the IE6 style sheet

This means if less than or equal to IE 7 then do this. These comments are only read by IE browsers.
If you can resolve the issue without using this it would be better though.