Relume Community Icon
Relume Community
  • 🏠Home
  • 📅Events

  • 🔵Announcements
  • 🔵General
  • 🔵Getting Started
  • 🔵Issues
  • 🔵Showcase

Powered by Tightknit
Issues
Issues

Webflow Padding Class Issue: Need Help Changing Class Size

Avatar of Alex Q.Alex Q.
·

I'm having an issue where the padding is just too large on some of this stuff, and for ex. I have elements padding-area-large class name... I see in the style guide there are ones ranging in sizes but when I try to change the class to padding-area-small for ex. it tells me "already exists". I guess because it things I'm trying to rename the class but I want to change the class. This is more of a Webflow thing but was hoping maybe someone in here can help.

10 comments

  • Avatar of Emily M.
    Emily M.
    ·

    You need to remove the padding-area-large class completely and add the padding-area-small one. To remove, you can hover over the applied class and there will be a dropdown arrow. Click that and then remove class. You can also just click beside the class and hit delete on your keyboard

  • Avatar of Alex Q.
    Alex Q.
    ·

    So removing the class won't remove the element then. I thought that maybe it would remove the element. Do you know also where to see what kind of element it is? I've noticed that in the tree hierarchy it shows it by class name and also it seems to just say the class name on the right.

  • Avatar of Emily M.
    Emily M.
    ·

    No, the class is for setting styles on an element. It is the CSS identifier for HTML elements. I’d recommend watching some Webflow University videos to get your head around it 😊 they’re not boring i promise Probably in settings on the right, although I’m not sure!

  • Avatar of Alex Q.
    Alex Q.
    ·

    Yeah. I have been doing web development all my life so very familiar with doing it in code and most of Webflow is self-explanatory for me but there's a couple things here and there I struggle to find. I have seen some WF University videos that come up but this particular thing I couldn't find a video. I will probably ask in the WF forum. Thanks for your help!

  • Avatar of Emily M.
    Emily M.
    ·

    Ah okay, never mind me then hahah

  • Avatar of Emily M.
    Emily M.
    ·

    Could you let me know if you get an answer on finding the type of element?

  • Avatar of Alex Q.
    Alex Q.
    ·

    Sure, will do!

    👌1
  • Avatar of Alex Q.
    Alex Q.
    ·

    Hey Emily M., here is the answer: In Webflow, when you give an element a class name, the Navigator panel (the left panel that shows the hierarchy) will display the class name instead of the element type. This is helpful for quickly identifying elements based on their styling or function rather than their HTML tag type. However, if you want to see the actual element type (like div, section, article, span, etc.), here’s what you can do:

    1. 1.

      Navigator Panel: While the class name is shown in the Navigator, you can hover over the element in the Navigator. A tooltip will appear showing the HTML element type (e.g., div, section). This is a quick way to check the type without clicking into the element.

    2. 2.

      Settings Panel: Select the element, then go to the Settings panel (the gear icon on the right). In this panel, under the ‘Tag’ section, you will see the element’s tag type. If it’s a div, section, or other standard HTML elements, it will show up here.

    3. 3.

      Breadcrumb Navigation: Another option is to look at the breadcrumb navigation at the bottom of the Designer. It shows the hierarchy of the selected element and includes both the element type and its class name.

    4. 4.

      Selector in Styles Panel: When you have the element selected, check the top of the Styles panel. It will show the class name, but if you look at the breadcrumbs right above the class name field, you’ll see the element type (e.g., div, section) as part of the selector path.

    👌1
  • Avatar of Emily M.
    Emily M.
    ·

    Wow thank you Alex!! That’s great

  • Avatar of Alex Q.
    Alex Q.
    ·

    You're welcome