Set exact button size

hi, I’m using gtkmm4, I’m trying to create a round button, I set the border radius in a css file to 50px,
but the button is created as an ellipse, and not as as a circle:
image.
How can I scale the button width or height to create a circle instead of an ellipse?

You can use the circular CSS class on the button to accomplish this. You can also set min-width and min-height properties manually.

Thx! I’m afraid setting min-width and min-height properties didn’t help.
I couldn’t find a n example of how to use the circular CSS class, if you could point me to one it would be great.
In the meantime I played with some properties in the gtk inspector, and it turned out that removing the “text-button” class solved the problem. I would love to understand why is that, could you please point me to the relevant documentation?

The CSS classes for a widget are usually documented in the C docs for the widget itself: Gtk.Button

You can add/remove CSS classes from code by calling add_css_class and remove_css_class on the widget. Style classes can also be added from .ui files if you’re using those, see here for an example of how to do it.

I don’t think all the details for why it’s happening are included anywhere, but the issue is probably that the text-button class adds some padding to space out the text. The circular class will then remove the padding, you could remove it manually, or you could try to use min-width and min-height and set them to be greater than the padding if you wanted a really huge button.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.