Problem when saving Word documents as HTML file.

Question

Hi. I am having trouble saving my Word 2013 document as an HTML file. I have inserted some calculus equations in the document which I expect to be displayed the same way in the web browser.

This issue is specific for equations with WHITE as their font colour. If I select any colour as the page's background colour and select White for the equations and symbols, these equations are not displayed in the web browser. Instead of the equations, their place is shown empty or specifically, perfectly transparent. As if there is nothing there.

I am well aware that the elements which can't be converted in the HTML format are saved as transparent PNG images and are displayed as an image in the browser. Hence, I suspect that the equations with white font colour are saved as blank transparent images. And due to this their place is seen empty in the web browser.

On the other hand, if I select any other darker colour for the equations' font then they do show up in the browser. But on the condition that the background colour should be faint or light one. Else, it does not render the images correctly. I assumed that the PNGs are not saved with high but with moderate quality which results into their distortion.

There is also another issue with Hyperlinks. No matter how much time I devote in finding out a solution for this issue, it still persists! The problem is that the text which are hyperlinked show a blue UNDERLINE in the web browser which I don't expect. I tried several suggestions including using the "text-decoration:none" attribute. But it didn't work! Hence, I need a solution for that too.

Please do help me out of this. I have already wasted much of my time on it. I want a full and final solution. Thanks in advance.

Note:- I tried saving the document as all the available options for HMTL including Filtered, Single Page (.mhtml), etc. I also tried editing "Save as --> Tools --> Web Options".

Answer 1

Do you see this only in Word?

Could you upload the screen shot to know more.

Answer 2

Here are those two images:-

   

Not able to see?? They are here. They won't show up :/

Could you please attach "image002.png" and "image004.png" as separate image files to a new post in this thread?

And a sample of the hyperlinks HTML code.

Answer 3

Could you post a sample of the HTML code with unexpected browser display?

Here's a sample of the code. This sample consists of the code which displays two of the equations by using the images "image002.png and image004.png":-

<p class=MsoNormal style='line-height:normal'><b><span style='font-size:15.0pt;

font-family:"Cambria Math",serif;color:white'>                   ⇒        </span></b><span

style='font-size:11.0pt;line-height:107%;font-family:"Calibri",sans-serif;

position:relative;top:5.5pt'><img width=193 height=25

src="SomeExamples_files/image002.png"></span></p>

<p class=MsoNormal style='line-height:normal'><span style='font-size:15.0pt;

font-family:"Cambria Math",serif;color:white'>                                </span><span

style='font-size:11.0pt;line-height:107%;font-family:"Calibri",sans-serif;

position:relative;top:12.0pt'><img width=314 height=44

src="SomeExamples_files/image004.png"></span></p>

Here are those two images:-

   

Not able to see?? They are here. They won't show up :/

Answer 4

Do you see this only in Word?

Could you upload the screen shot to know more.

Here are the screenshots:-

1.) How it should actually be displayed:-

2.) How it is displayed by the browser:-

Answer 5

Could you post a sample of the HTML code with unexpected browser display?