CODEWITHSUNDEEP
htmlcsschmhtml-help-workshop
imou
imou

Reputation: 31

How to Center a picture in HTML using HTML Help Workshop?

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>

Upvotes: 3

Views: 314

Answers (2)

help-info.de
help-info.de

Reputation: 7298

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?

Upvotes: 1

Gugu
Gugu

Reputation: 11

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

Upvotes: 0

Related Questions