Skip to main content
Almtuna
Almtuna
Inspiring
September 1, 2022
Question

Table text too small on Android (Resp html5)

  • September 1, 2022
  • 2 replies
  • 314 views

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?

    This topic has been closed for replies.

    2 replies

    Matt-Tech Comm Tools
    Community Expert
    Matt-Tech Comm ToolsCommunity Expert
    Community Expert
    September 2, 2022

    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

     

    -Matt Sullivan, FrameMaker Course Creator, Author, Trainer, Consultant
    Bob_Niland
    Community Expert
    Bob_NilandCommunity Expert
    Community Expert
    September 1, 2022

    What are the FM Paragraph Formats for the various cell para types?
    What say they for the font size of the deminutives?

    Almtuna
    AlmtunaAuthor
    Inspiring
    September 1, 2022

    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;
}

     

    Bob_Niland
    Community Expert
    Bob_NilandCommunity Expert
    Community Expert
    September 2, 2022

    I have very little experience with the FM output to HTML, but a couple of things catch my eye in the mapping:

    1. font-size:…;
      That's getting set despite it being blank in the CSS rule setup; interesting. I might have expected that Attribute to be omitted, causing the font-size to just inherit.
    2.  11.0pt;
      Do you have any ability to change that to another HTML metric, such as em?
    3. font-family:'Open Sans', sans-serif;
      So the serif family used in the FM source is being deliberately changed to sans?
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices