23.6.2 Aligning anchored graphics
To override the FrameMaker alignment of an individual graphic or a group of graphics (for example):
; Graphic ID = desired alignment to text, one of these: left, right,
; top, texttop, middle, absmiddle, baseline, bottom, or absbottom
The [GraphAlign] section sets the HTML align attribute of the <img> tag itself; this attribute controls only vertical position and left/right floats in HTML.
Floating graphics might hide text
If you set alignment to left or right, you are also telling the graphic to “float”. This might result in the text that follows (such as a caption, if captions are below the image in your FrameMaker document) disappearing behind the image. If this happens, for the graphic involved you should also specify:
Or, you can specify "left" or "right" instead of "all", depending on the effect you want.
Realign graphics independently of anchors
To position graphics independently of the paragraphs in which their frames are anchored, if you are using CSS you must also specify the following:
; GraphAlignAttributes = Yes (default, allow when set in [GraphAlign])
; or No (no align attribute in img tags even if set in [GraphAlign]).
; Default is reversed to No if UseCSS=Yes.
When you use CSS, by default Mif2Go ignores any alignment attributes you specify in [GraphAlign]; see §22.5 Understanding how CSS affects other options. If you are not using CSS, by default Mif2Go uses the alignment attributes in [GraphAlign].
For graphics in anchored frames that are neither inline nor run-in (float in HTML) you can specify a horizontal position different from that used in FrameMaker:
; Graphic ID = desired alignment for containing para: left, right,
; or center, primary method of centering standalone graphics
The [GraphParaAlign] property sets the HTML align attribute for the paragraph in which the graphic frame is anchored; this is how Mif2Go controls horizontal alignment of graphics. For example, the following setting uses a wildcard (see §4.6 Using wildcards in configuration settings) to center-align all anchored graphics in HTML:
However, the align="center" attribute does not work as specified by the W3C in most browsers.
When you use CSS, you can center graphics with Mif2Go macros. For example, to center all images:
See §23.5.2 Replacing or surrounding a graphic with macro code.
div.img {text-align: center; }
Or, if Mif2Go maintains CSS for your project (see §22.8.4 Overriding styles in Mif2Go-generated CSS files):
div.img {text-align: center; }
You have to use <div> because CSS applies text-align only to block elements, and <img> is not a block element.
> 23 Including graphics in HTML > 23.6 Positioning graphics in HTML output > 23.6.2 Aligning anchored graphics