Using CSS, how do I get IE to perform as Firefox, Mozilla do with white-space:pre-wrap?

With but basic CSS, Javascript and html skills that are rusty and outdated, I try to help friends customize our Blogspot blog (Blogger) with basic Javascript and CSS ... "Blogger" has a limited WYSWYG editor for it's posts ... and those posts are properly rendered under both IE and Firefox when published as posts.  I personally use Homesite 5 but everyone else associated with the Blog (www.theoldbarbershop.com) uses the "Blogger" post editor.

However, much of what we do is published using  the generic Html/Javascript widget they provide, ... and such code is rendered as if was simple html ... collapsing spaces and such ... although they recognize any external .js or .css files stored in the "head" of the blog's template.

Adding "white-space:pre-wrap" to the styles produces acceptable results ... but not in IE browsers ...

What I would like to know is what to do so that when the code generated by the post editor, mostly simple text and images, is being rendered... what styles should I apply so that the rendered pages are cross browser acceptable ... especially that IE rendered pages are reasonably close to the "white-space:pre-wrap" Firefox ones ... relative to retaining white spaces, line breaks and such formatting.

IE collapses and everything runs together ... we want to retain extra spaces and forced line breaks ... and need to use the WYSWYG editor as 5 of the 7 writing the articles have no real knowledge of using Html in marking up documents.

I don't have any preference with regard to method, just want the job done ... but the volume makes the brute force method of my manually adding <BR/>s and <P>s less than desirable.

Thanks!

Bob

I have no idea as to the difficulty level ... but assume it is about average