CMS text size help

Hi, within webflow’s cms, why can’t I control font size? No matter what I do, any text that is bulleted always get shrunk relative to the text around it.


Here is my public share link: www.comehome.ai
(how to access public share link)

Your style rules on your rich-text element are controlling the font-sizes.

.blogpost p { margin-bottom: 10px; font-size: 18px; line-height: 28px; }

.blogpost ol, .blogpost ul { margin-top: 20px; margin-bottom: 20px; font-size: 16px; line-height: 28px; }

Also remember to link to an actual page where the problem exists and let us know what elements you are talking about. That way we don’t have to dig around to help.

1 Like

These are 3 options.

  1. You can use Richtext h1 to h6

  2. For a particular CMS page, you can add a data-attribute slug and you can set CSS use in data-attribute
    Example:-
    Page1, Page2, and Page3 in CMS you can change for Page2 Heading font size.
    I have added data-attribute on the body use slug because of slug unique id in CMS so you can use and add CSS for only Page2
    Screenshot by Lightshot,
    Screenshot by Lightshot
    [data-body=“bonzai-scrollx”] .yourclassname {
    font-size: 20px;
    }

  3. You can create in CMS number field

    These CMS fields use embedded styles like

    • For Desktop in embed code
    .yourclassname yourtag { font-size: link your CMS field Desktop font-sizepx; }
    • Ipad font-size
      @media screen and (max-width: 991px) {
      .yourclassname yourtag {
      font-size: link your CMS field Ipad font-sizepx;
      }
      }

    • Mobile font-size
      @media screen and (max-width: 767px) {
      .yourclassname yourtag {
      font-size: link your CMS field Mobile font-sizepx;
      }
      }