How can I float text elements left on the same line?

Eg below on this forum.

Think a common social app where one line includes [username] [post date] [999 comments] etc.

Need to accommodate short and long usernames, post dates, etc.

Eg 1: malcolmLewis66 | Jun 27, 2020 | 1,765 comments
Eg 2: bob65 | 1:40 pm | 7 comments

Go into the responsive editor.

Inside your one line you should have a few groups
But they should be spaced out how you like:
[Group1] [Group2] [Group3]

In the responsive editor select [Group2] and then allign left.
Do the same with [Group3]

That should do it!

Thanks. Not working on first try but will keep at it. Is it possible to share a working example?

To provide another example. Like this. The " &middot 1st" will float right as the name gets longer.

Screen Shot 2020-09-14 at 11.32.01 PM

Bubble doesn’t support expanding elements width, only height.

The way to do this would would be string it all together in one text element.

DynamicValue (name) l DynamicValue (date) l DynamicValue (comments:count)

For your second example you would do the same. But after having set up your dynamic values, open up the rich text editor and make the dynamic value for the users name bold.

1 Like

Worked! Thanks!

Problem. They are 3 separate clickable data elements but your suggested solution renders them as one clickable item. Can I make them separately clickable? Ie the equivalent of:

DynamicValue (name) l
DynamicValue (date) l
DynamicValue (comments:count)

Yep. Wrap each Dynamic Link in standard HTML to include the link.

[url=]Dynamic Value(name)[/url] | [url=]DynamicValue(date)[/url] | [url=]DynamicValue(comments:count)[/url]

Thanks. I got close with this. I just need to figure out how to get the dynamic data in there.

Just do everything in the dynamic editor window. Type in the HTML, then select your dynamic content. You are just concatenating a field. Build it with the text, HTML, dynamic content you need.

Screen Shot 2020-09-16 at 12.44.30 PM

1 Like

Just to mention it, the rich text editor takes BB code, so anything you can do with BB you should be able to achieve. I haven’t tried everything… but e.g. if you want to highlight text, which isn’t “supported”, you can easily do that by using bb code


Just write it in the dynamic editor window like this.

Bubble is hiding functions [highlight=#EBE6CD]from us[/highlight]

1 Like

So to close the loop and share the knowledge check out the output below followed by the BBCode in the rich text editor. Thanks again, @derek1!