IE9更改内容 <img> 打印时

Question

I am trying to print a webpage which is supposed to contain some images (icons). They are displayed alright in the page, and Firefox prints them fine, but IE ruins most of them.

( Alt )

What is doing this, and how can I fix it?

These icons are being set in a loop in JSP:

<t:dataTable newspaperColumns="1"
    value="#{page.afterSales.leftOptionColumn}" var="row">
    <h:column>
        <h:graphicImage value="#{row.imgIsCompleted}" style="width: 16px !important;"/>
        <h:commandButton value="#{row.rowName}"></h:commandButton>
    </h:column>
</t:dataTable>

Answer 1

The reason for that problem is unknown to me, i can say it is because of heavey CSS altought.. but as a work around i recommand you extract target DOM element with js, and create a new window where you have the content free from CSS styles which can genereate such a problem with <img> tags.

My work around:

function printCssCleanContent(){
                                var prtContent =  Ext.query('span[id*=overView]')[0]; // just the root dom node i choise to print (can be done with vanilla js or jquery or any other dom parser) 
                                var WinPrint = window.open('', '', 'left=0,top=0,width=1200,height=900,toolbar=0,scrollbars=0,status=0');
                                WinPrint.document.write(prtContent.innerHTML);
                                WinPrint.document.close();
                                WinPrint.focus();
                                WinPrint.print();
                                WinPrint.close();
                            }