Skip to main content

Adding texts with different styles in the same line.

Vishnu Raj
  • Edited

How can I implement a text content like the one in the image with different font sizes??

I tried to add it as two columns. But then the space between the texts varies as per screens. I want the space between two texts to be equal in all screens.

Any help would be appreciated. Thank you.

0

Comments

3 comments

Date Votes
  • Sandra Prunici
    • Edited

    Hi,

    If you are designing a site in the WordPress environment, you can add some inline CSS something like here. The modifications will not be visible in the editor mode but in the preview, you will be able to see the inline CSS you added. See here.

    If you create the site in the Brizy Cloud, unfortunately, at the moment, isn't possible to add an inline CSS and therefore isn't any possibility to create a text element with different styles. Here, the unique solution is to create an embed code with the entire code and style for the text.

    Thanks!

    Best regards,
    Sandra

    0
  • Vishnu Raj

    Thanks for the reply. I had tried that. Bt I had encountered a problem.

    For eg imagine if the part of the text with font size 40 is A and the part with font size 25 is B. If B contains some 10-15 words it goes below A which is not what I am preferably looking for. Would prefer it below B itself. (It also has huge line space even when the line-space was given as 1).

    That's why I thought abt adding two parts in two different columns where as I said in the original question I would like the space between A and B remains the same on different screens.

    Any help would be appreciated. Thanks once again for taking time to reply.

    0
  • Sandra Prunici
    • Edited

    Hi,

    In the inline CSS, you can also set the custom line-height property for the text but yes will not be possible to set the B text to break below B itself because they are the same text element. The solution for this case can be only adding the A and B text in 2 different Text elements.

    To have the same space between these 2 texts element it is a bit complicated but you can try to open the mobile and tablet mode of the builder https://jmp.sh/AUdkg56 and adjust the text settings (padding, margin, column width) to display fine.

    Best regards,
    Sandra

    0

Please sign in to leave a comment.

Didn't find what you were looking for?

Ask a Question