Copy link to clipboard
Copied
I use FM19 to publish as responsive html5. I have a table that looks fine on my desktop pc and on my laptop:
As you can see above, the table text has the same size as the body text.
However, on my Android phone, the table text suddenly becomes very small:
(Sorry for the scaling issue, image size should be much smaller, as my cell phone screen.)
Anyway, as you can see, the table text isn't even half the normal text size.
Due to this, the google indexing says "Page isn't usable on mobile", "Too small text to read" and "Viewport not set".
What can I do to get bigger table text?
Copy link to clipboard
Copied
What are the FM Paragraph Formats for the various cell para types?
What say they for the font size of the deminutives?
Copy link to clipboard
Copied
Text-format wise they are identical.
The FM "body" paragraph style has font Times New Roman, size 11 pt. Which is mapped as:
The css file then contains:
p.FM_Body { margin-left:0.000pt; margin-right:0.000pt; text-align:left; text-indent:0.000pt; margin-top:0.000pt; margin-bottom:5.000pt; word-spacing:normal; font-family:'Open Sans' , sans-serif; font-style:normal; font-weight:normal; font-size:11.0pt; color:#000000; background-color:none; text-decoration:none; letter-spacing:normal; line-height:22px; }
The FM "Table body" paragraph style has font Times New Roman, size 11 pt. Which is mapped as:
The css file contains:
p.FM_Table_Body { margin-left:0.000pt; margin-right:0.000pt; text-align:left; text-indent:0.000pt; margin-top:0.000pt; margin-bottom:4.000pt; word-spacing:normal; font-family:'Open Sans' , sans-serif; font-style:normal; font-weight:normal; font-size:11.0pt; color:#000000; background-color:none; text-decoration:none; letter-spacing:normal; line-height:22px; }
Copy link to clipboard
Copied
I have very little experience with the FM output to HTML, but a couple of things catch my eye in the mapping:
Copy link to clipboard
Copied
The p.FM_Body and p.FM_Table_Body leads me to believe you are using the default mappings to HTML, rather than explicitly mapping to defined CSS definitions. I've never been happy with output that uses the default mappings.
Among other things, default mappings write to an "on the fly" CSS, and that CSS is almost impossible to control.
Try mapping your 2 para tags to either an existing CSS entry, like BodyLevel1, or create a new CSS class altogether
(don't use Body, so as not to be confused with the BODY html element name)
If the two tags are mapped to the same CSS style, they should appear the same in your output, and if they are mapped to something in your "main" CSS, you should be able to control the size of the text.
Pro tip 1: I usually play around with the color of the text first, to be able to easily see the scope of the CSS. Once I get the correct mappings and CSS entries in place, I remove the test settings in the CSS, and adjust the size.
Pro tip 2: Use the same size units throughout your CSS. Mixing px, pt, and em can also result in unintended formatting.
-Matt