I need to resize an image using Microsoft Office prefixes (MSO)
It's important to note that I am unable to use inline styles.
I've already tried the CSS
and HTML
versions using %
,px
and no specification as shown here:
img {
display: block;
width: 600;
height: auto;
}
However these have no effect.
I understand that I will most likely need to use the MSO
prefix instead. Although, I can't seem to find any that will allow me to change the properties of the image.
Expected Result:
Images are resized once sent to the word document
Actual Result:
Images are not affected by any styling.
For reference the type of prefix that I'm looking for is exactly the same as: https://gist.github.com/webtobesocial/ac9d052595b406d5a5c1
but simply with the ability to alter images instead of changing font-family etc.
Do you know what I'm missing? Any help is much appreciated.
<!-- /* Style Definitions */
img {
height: auto;
max-width: 8.5in ;
}
@page firstSection{
size:8.5in 11.0in;
margin:1.0in 1.25in 1.0in 1.25in ;
mso-header-margin:.5in;
mso-footer-margin:.5in; mso-paper-source:0;
}
-->
Response.ContentType = "application/msword"
Response.AddHeader "Content-Disposition","attachment;filename=documentName.doc"
Response.write("<html " & _
"xmlns:o='urn:schemas-microsoft-com:office:office' " & _
"xmlns:w='urn:schemas-microsoft-com:office:word'" & _
"xmlns='https://www.w3.org/TR/html401/'>")
Response.Write "<!--[if mso]>" _
& "<tr><td style='padding:0px;margin:0px;'> </td><td style='padding:0px;margin:0px;' width='560'>" _
& "<![endif]-->"
Response.Write"<!--[if gte mso]><xml><w:WordDocument>
<w:View>Print</w:View>" & _
"<w:Zoom>90</w:Zoom><w:DoNotOptimizeForBrowser/></w:WordDocument></xml>" & _
"<![endif]-->"
<body lang=EN-US style='tab-interval:.5in'>
<div class=Section1>
<!--Printable Content is added here EG-->
<img="https://i.sstatic.net/l60Hf.png"/>
</div>
</body>
</html>
Response.Write "<!--[if mso]></td><td style='padding:0px;margin:0px;'> </td></tr><tr>" _
& "<td colspan='3' style='padding:0px;margin:0px;font-size:20px;height:20px;' height='20'> </td></tr></table>" _
& "<![endif]-->"
For anyone else who is looking for this answer in future the solution is unfortunately an inline style.
MSO
will not accept CSS
properties on images. However, you can use the basic HTML
attributes:
width='640' height='400'
Which Microsoft Word will actually listen to. The only downside being is that these do have to be in-line.
Thus, in this scenario I used
Replace()
to edit any<img style=
tags with:"<img style= width: 640px;'" width='640'
This has fixed the majority of my image size formatting issues in word and I hope this answer will prove useful to someone else someday.