• Resolved inj9nhs3fhpabx4

    (@inj9nhs3fhpabx4)


    In the Oceanwp theme, in the footer widgets area, I have four (4) columns.

    In the second column (Widgets->Footer 2), I have used the widget ‘Custom HTML’ to add some text.
    In this specific column, I want to set the text font size=10px for the desktop browser and font size=8px for mobile.

    I am unable to make these changes using the Customizer:
    Customising->Widgets->Footer 2
    Customising->Typography->Footer Widget Heading

    Is there some other option which enables this in Customiser?

    Or is there some CSS code that will allow specifying the Browser and Mobile Text font size for Footer widget column content.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Hi, you can use media queries rules like this :

    @media screen and (min-width: 768px) {
      .your_widget_class {
        font-size:10px;
      }
    }
    @media screen and (max-width: 767px) {
      .your_widget_class {
        font-size:8px;
      }
    }
    Thread Starter inj9nhs3fhpabx4

    (@inj9nhs3fhpabx4)

    Thanks.
    Can you advice how to find out the “your_widget_class” for the Oceanwp theme Footer widget 2nd column? I tried doing inspect element on the Chrome browser, but not being proficient in CSS, need guidance:
    Is it
    #footer-widgets
    Or is it
    textwidget custom-html-widget
    Or is it
    custom-html-widget

    Also, I want the sizing ONLY for the 2nd column in the footer widget. The 3rd column also uses the same ‘Custom html’ widget but I want it to remain as is. How do I specify only the 2nd footer column widget in CSS?

    Hi, very simple, look the class of the div for the second colum:
    class="footer-box span_1_of_4 col col-2"
    The target class is:
    .footer-box.col.col-2

    Theme Author oceanwp

    (@oceanwp)

    Hi, thank you @momo-fr ??
    It is that.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Change Mobile Text font size for Footer widget column content’ is closed to new replies.