Spacing issues in different browsers.

[Orchard_Direct]

I created my product layout page in mozzila, it wasnt untill i checked it in Internet explorer to see if it was alright that i discoverd there was a big spacing error.

if you view this link in mozzila and IE http://www.orcharddirect.co.uk/store...roducts_id=162
you will see that #productwrapper2 (the add to cart module) is perfectly positioned in mozzila and has a unwanted space in IE. How can i fix this? Any help appreciated.

Elliot

[schoolboy]

This is largely because MSIE refuses to adopt global convention regarding some key aspects of CSS.

(If you see what you want appearing correctly in firefox, know that your CSS is accurate and correct. The problem is MSIE browser...)

Trouble is, creating separate css for MSIE is complex.

[Orchard_Direct]

Im fairly competent with css, so if u could point me in the right direction. ive exausted all my ideas, its doing my head in! cheers.

[schoolboy]

Best I can suggest is that you do a google search for things like:-

"css problems with MSIE" and
"internet explorer css compliance"

...etc

[gjh42]

There is the <!--if IE--> conditional comment that can be used to load a supplemental stylesheet for IE. You can make it version-specific, too. Search on that for more info.

[Orchard_Direct]

Ill have a look, if there is quicker way u can think of in the mean time be sure to let me know cheers!

PS - I would prefere to have it working in IE over mozzila just due to the fact that most people dont use BETTER browsers, so if there is anyway i can edit my existing style sheet to work, could u let me know. thanks again

[schoolboy]

Try going HERE

[Orchard_Direct]

Try going HERE

Is there anything on their that applies to my problem? I cant find anything will help fix my problem however it points out some useful tips.

thanks once again

[yellow1912]

IE is behaving correctly in this case:

To have what you want, you have to float the image to the left, and then float the add-to-cart group to the right.

[Orchard_Direct]

IE is behaving correctly in this case:

To have what you want, you have to float the image to the left, and then float the add-to-cart group to the right.

Unfortunatly that does not work, in mozzila it puts the text above the add to cart module and in IE it does absolutely nothing, ne other ideas?
cheers