Home Forums Designer Blocks for Gutenberg Additional CSS Class in a list

Topic Resolution: Resolved

This topic contains 5 replies, has 2 voices, and was last updated by  jmittendorf 2 weeks ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #60022

    jmittendorf
    Participant

    Hello,

    I have tried to create a new CSS Class for a list to change the font-size.

    My new class is called “mylist-size”.

    I have made this entry for an Additional CSS Class in the Gutenberg Editor for a list entry.

    But I don’t know where to write the class complete.

    I want to it over Design – Customizer – Custom CSS , but then I have found nothing about the list entry.

    Thank you very much for the help. I hope I have explained it correctly.

    Greetings Jörg

    #60025

    scrambler
    Moderator

    If you mean you added a LIST block, then in the advanced options of the block added your class, then all you need to do to style the list using the class, is add your CSS rules using the class in the theme Global Custom CSS Rule box.

    For example, the rule below will change the font size.

    .mylist-size {font-size:150%;}

    If you need more help, please be specific and provide a link to the page with the list in place

    #61147

    jmittendorf
    Participant

    Sorry for the late answer, but the last weeks I had the no time to look in this forum.
    I have read your answer, but I have some questions again:

    1. I put the code
      .mylist-size {font-size:150%;}
      in the Global Custom CSS Rule box.
    2. I define a class in the block of the gutenberg editor where I want to change the font-size under advanced – additional css class, but how I define the class?’
      Must I use the # or again the point for the class.

     

    #61148

    scrambler
    Moderator

    If there is a box to specify the class, you just put the name, no dot or pound, so in this case just  mylist

    The dot or pound is added when you use the selector name in a rule to specify if it is a class or an ID.

    When specifying a selector inside a CSS rule  .mylist would mean mylist class, #mylist would mean mylist ID

     

    #61151

    jmittendorf
    Participant

    Thank you very much for the quick answer. I will try it tomorrow and I report again.

    #61286

    jmittendorf
    Participant

    Thank you very much for the support. It works.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.