What’s the best way to set for example text opacity of 0.7 but as an accurate number? At this point (if I’m not wrong), there is the only way to do this by the slider, but the slider solution cannot be 100% accurate.
Best regards,
T
3 ways I can think of to do it:
- Give your text element a unique ID Attribute and then target that attribute with CSS.
- Use inline style tags to target the element with CSS using the rich text editor
- Or if you want to apply it to all the same text elements then target the Class with CSS.
1 Like
Thank you! In this way, I can also set the border width of each group to decimals? At this point, it’s only possible to make it integer (1,2,5) by Bubble editor?
Yes. The integers in Bubble are pixels, so a value of 1 is 1px. So if you use your own CSS you have more control. You could use 0.5px, rem or em depending on exactly what you want.
Hope this all makes sense, I have no idea how well you know CSS, but hopefully you get me.
1 Like
Awesome, thanks, I will figure it out on details, but it’s important that I’ve realized on how to make it possible. 
Just reply to this thread if you get stuck and me or someone else will help you out, it’s pretty straightforward.
1 Like
Hey @wrightj2 , a quick question:
How do you change the input’s placeholder color with the CSS? Some placeholders cannot be changed by Bubble editor so I guess I would also need to change this by CSS…
I’ve tried Googling it a bit but didn’t find it.
Also, if you could suggest me on how to add horizontal padding when it’s not possible by Bubble default. I would find it very useful.
Thank you,
T
You might benefit from reading this post.
Not only can it be set explicitly and accurately via the editor by typing the value into the field in rgba format, but it can also be set dynamically. That’s how this was created.
1 Like
That’s a clever tip, I like that one. Thanks
1 Like
Basically, you need to work out what the ‘Class’ is of the element you want to apply the CSS to (or give it an element id) and then determine which CSS attribute you need to change.
Chrome Dev tools is your best friend here and you can inspect the element (in preview mode) to work all of this out.
If you look at this screenshot, I’m inspecting an element in Chrome.
No.1 - shows me the class name I need to target
No.2 - shows me the HTML & the CSS currently applied to the element
No.3 - is where you can experiment by adding/changing the CSS to achieve what you want
No.3 - if you scroll down to the bottom of that panel (not shown in screenshot) you can see the padding & margin values
I would caution though that you can spend a lot of time messing around with all this, so only you can decide if it’s the best use of your time. Particularly when there are tools like Frames and Buildshare (from @Sudsy) that already look beautiful and are done for you.