Problem aligning objects to particular words or particular lines in a text field

Text Fields ››

PROBLEM

In ToolBook I carefully align objects with a particular word or a particular line of text in my text field, but in DHTML the alignment is way off.


DETAILS

There are 3 general reasons that such a problem can occur, and each of these are discussed below.

WORD WRAPPING

When you add text to a field, you are not specifying where (at what pixel coordinate) every character should be drawn. Instead you specify only the text, and that text then naturally flows into the available field space, word wrapping when necessary. It is very possible that word wrapping will occur slightly different in various Web Browsers. This is all controlled by the rendering engine of the Web Browsers.  


In the following example you can see that the word "CAUSE" fits onto the end of the second textline in ToolBook, but as seen in a Web Browser it doesn't fit, and instead flows to the next line. This causes all the rest of the words in the text in the field to be shifted (word wrapped). In fact it causes a new 5th line to appear in the first paragraph.


This shifting can cause very obvious alignment issues if you attempt to place an object next to a particular line in a text field, or perhaps use a rectangle object to highlight a few words in yellow.


Possible solutions



LINE SPACING

When you add text to a field, you are not specifying where (at what pixel coordinate) every character should be drawn. Instead you specify only the text, and that text then naturally flows into the available field space.


The spacing between lines (called Leading) is something you have no exact control over. When viewing within ToolBook itself, ToolBook will handle the Leading for you as the text flows from line to line within a field. The same is true for a Web Browser. The Browser's rendering engine is in charge of the Leading, and it is common to see Firefox and Chrome use a slightly different Leading value than ToolBook (and other web browsers) uses. Firefox and Chrome tend to add 1 additional pixel of Leading space to each line of text in a field.


This means that if you have 10 lines of text, the 10th line will be about 10 pixels lower on the screen than you're expecting it to be (as compared to what you see directly in ToolBook). This shifting can cause very obvious alignment issues if you attempt to place an object next to a particular line in a text field, or perhaps use a rectangle object to highlight a few words in yellow.


Possible solutions



FONT PIXEL SIZING

The Display settings on a user's computer could be having an effect here, but ToolBook has a feature you can turn ON (when Publishing) to ensure the user's Display settings will have NO effect. The setting, in the Web Publishing options, as seen below, is captioned "Use Pixel Sizing For Fonts". Turn this setting ON if you want the user's Display settings to have No effect on the text rendered in HTML. This setting is ON by default.


   



KEYWORDS: align bottom edge missing cut off move spacing




Created with the Personal Edition of HelpNDoc: Free help authoring tool