Working(not working in IE7) example here:
The reason this is happening is because IE 7 follows a different flow compared to say IE 8 and IE 9, because of this you won't be able to use z-index on #modal_dialog selector but instead add it to your .width-limiter selector as that is the top level element/parent for your modal window.
Unfortunately I can't do that, because the code in my example is just an isolation of the problem, and the real page is more complex, not allowing your solution to work. I just moved the modal dialog outside the .width-limiter div, and all is well. Thanks for taking to time to look at my problem and respond. I do appreciate it.