3

I'm using HTML HELP Workshop to create help file. My problem is when I center an image in HTML, the picture always appears placed in the extreme left of the CHM file. But I've found the image in the middle in the internet browser (Internet Explorer).

I want the image to placed in the center of CHM file and Internet browser. This is my HTML:

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<HTML>
   <HEAD>
      <meta name="GENERATOR" content="Microsoft&reg; HTML Help Workshop 4.1">
      <Title>Picture</Title>
   </HEAD>
   <style> 
      img {
      display: block;
      margin-left: auto;
      margin-right: auto;
      } 
   </style>
   <BODY><img src="C:\Users\LENOVO\Desktop\cd\help\Graph.htm_Images\image.png" alt="Home Appliances Data " ;></BODY>
</HTML>
help-info.de
  • 5,228
  • 13
  • 34
  • 35
imou
  • 31
  • 1
  • It works here fine. Check https://codepen.io/saularis/pen/eqWBYV – Saularis Jul 30 '19 at 22:34
  • As the app showing the CHM-file is likely running IE internally in _compatibility mode_, auto margins doesn't work. Instead wrap the image in a `div` and give it a CSS rule with `text-align: center` ... or simply add `text-align: center` to the `body`, instead of auto margin on the image. Which to use depends on how the other elements relates to the `body`. And if you set it on the `body`, other elements with text/image content might need to have the alignment reset, e.g. with `text-align: left` – Ason Jul 31 '19 at 16:30
  • @Saularis Yes, but it doesn't in the CHM file, and for the reason I wrote in my previous comment. – Ason Jul 31 '19 at 16:37

2 Answers2

0

You need to add following line in your <head> section by using e. g. your favorite text editor. 

<meta http-equiv="X-UA-Compatible" content="IE=9"/>

Please note that IE9 on Windows 7 (and all other recent versions of the major browsers) can properly render your content used in your question.

Unfortunately if you take your content and run it through the HTML Help Workshop compiler to produce a CHM file the resulting output on the same machine looks a bit different. Please note CHM's are 20 years old!

Although the page display and functionality still works inside the Microsoft Windows Help Viewer, all the extra styling features are gone. This is true even though running a test on a Windows 10 Home Version 1903 machine that has IE11 installed that should be able to render these CSS features.

Tested today with the original HTML code you posted, using FAR HTML and HTMLHelp Workshop installed on my machine.

Adding the <meta> tag from above is also needed for using SVG inside CHM files.

A comprehensive answer was given for following question:

What does <meta http-equiv="X-UA-Compatible" content="IE=edge"> do?

help-info.de
  • 5,228
  • 13
  • 34
  • 35
  • @imou: You may be interested in following answer https://stackoverflow.com/questions/32344463/want-to-create-chm-file-from-website-html-pages – help-info.de Aug 01 '19 at 08:38
0

You could try to use margin: 0 auto; instead of margin-left: auto; & margin-right: auto;

Gugu
  • 11
  • 3