Styling Tooltips using CSS

The darktable team are in the process of converting from GTK 3 to version 4.

Looking at the code for some of the tooltips reveals numerous newline characters in longer tips.

I have tried using the CSS properties max-width and width, but these are flagged as “not a valid property name”, as is “word-wrap”.

Without these, and without hard-coded newline characters, the tip is displayed as a single, huge line.

Is there any way of specifying the width of a tooltip text box, given the unavailability of these properties? To avoid refactoring the underlying code, this should be done in CSS.

No. GTK’s CSS does not control the layout or sizing of text, as that’s the remit of the UI element that displays the text.

The only want to control the contents of a tooltip, like the maximum length in characters and the word wrapping, is to create your own widget, and then calling gtk_tooltip_set_custom() inside the GtkWidget::query-tooltip signal.

The default tooltip contents are set to:

  • expand horizontally
  • have a maximum width of 50 characters
  • wrap on a word boundary if the line width reaches the maximum width

If you’re experiencing a different behaviour, feel free to open an issue in the GTK issue tracker with a self-contained example exhibiting the behaviour.

I should note that I am acting as an intermediary here, not as the developer.

The code looks like:

gtk_widget_set_tooltip_text(controls->toe_warning_icon,
                              _("the curve has lost its 'S' shape, toe power cannot be applied.\n"
                                "target black cannot be reached with the selected contrast and pivot position.\n"
                                "increase contrast, move the pivot lower (reduce the pivot target output or\n"
                                "curve y gamma), or increase the distance between the pivot and the left edge\n"
                                "(increase the pivot shift, move the black point farther from the pivot by raising\n"
                                "the relative black exposure or move the white point closer to the pivot\n"
                                "by decreasing relative white exposure)."));

If one removes the newline characters, then the tooltip looks like this - https://d2x313g9lpht1q.cloudfront.net/original/3X/1/e/1e65a79b184d6e39367b5cd21ef14580f0da0835.jpeg

This doesn’t seem to have a maximum width of 50 characters, or word wrap.

I filched a “Hello World” program off the net, added a tooltip with the long text that I provided in my other post.

I get the behaviour you described. In other words, it looks like a bug in DT.

Thanks for testing, it’s much appreciated.

As you can imagine, the code base for darktable is large, and pinning down the source of the bug is difficult.

Could I be permitted another couple of questions:

  1. Has the default behaviour you mention always been the case, and if not, when was it introduced?
  2. That it is the default, implies it could be changed. Is there a function to do this, or definitions in a header file?

The reason I ask, is that this appears to be a longstanding bug, and I want to try and find when putting newlines in tooltip text was first done.

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