Is this a safe way to target CSS?

Ask for Help
1

See screenshot.

Is it safe to assume that I can reference/modify .kEeglU in CSS using a rich text component?

I’d like to reduce the horizontal padding a tad so I can squeeze in one more button.

image
image2126×1186 423 KB

2

No, that is an unstable class name and you should never use those. Please try to find a more stable one.

What specific element are you targeting here?

3

Horizontal padding for the choice components I’m using as filters.

Eg: All | ToDo | Done

4

Any suggestions, @ThinhDinh ?

5

image
image2128×1236 115 KB

I think this is what you want?

<pre><span><style>

div[id*='screenScrollView'] > div > :nth-of-type(1) >div :nth-child(2) >div {
padding-right: 0px;
}

Change the 1 in nth-of-type(1) to the corresponding order number of choice component on your screen.

Relevant documentation from @Lucas_Pires:

4 Likes
6

Thanks!

So this is bullet-proof/future-proof as long as my component layout doesn’t change?

Also, how can I test to see if my component choices wrap on other mobile screens? Kinda like the way the Chrome Inspector allows you to preview a screen on different devices?

image
image1828×888 188 KB

7

Yes, that’s true. As you have noticed, this relies on that specific choice components being 1st, 2nd and 3rd on your screen.

I assume you can use Device Mode to simulate it on other devices.

I also saw this, maybe you can try it.

1 Like