Please add more space between the button's icon and its label.

Bug #1674667 reported by Pojar Gheorghe–Ioan on 2017-03-21
10
This bug affects 2 people
Affects Status Importance Assigned to Milestone
Ubuntu theme
Undecided
Unassigned
ubuntu-themes (Ubuntu)
Undecided
Unassigned

Bug Description

As one can see on the screenshot, there's too little space between the button's icon and its label.

Triniton Adam (trinitonadam) wrote :

The following shows up when running gnome-maps:

(gnome-maps:20317): Gtk-WARNING **: Theme parsing error: application.css:14:30: The style property GtkButton:image-spacing is deprecated and shouldn't be used anymore. It will be removed in a future version

From gtk+ documentation:

/**
  * GtkButton::image-spacing:
  *
  * Spacing in pixels between the image and label.
  *
  * Since: 2.10
  *
  * Deprecated: 3.20: Use CSS margins and padding instead.
  */

Zicu Radu (zradu1100) wrote :

I confirm in zesty.

For this write my custom css:

.button {
    -GtkButton-image-spacing: 4;
}

but get above #2 warnings.

Khurshid Alam (khurshid-alam) wrote :

Which app was that?

You should be using (change the value if you need)

button.image-button { padding: 4px; } or

button.text-button.image-button { padding: 4px; } or

Or you could use margin

button {
  margin-left: 4px;
  margin-right: 4px;
}

Or even combination of both.

However all these will be applied for all buttons and can break the design. Ideally this type style should only be used for specific buttons;i.e in above case destructive buttons.

The node will get the style classes .image-button or .text-button, if the content is "just" an "image" or "label", respectively.

At least so far solution that works is:

button image {
    padding-left: 4px;
    padding-right: 4px;
}

but these will be applied for all buttons and break the design.

To post a comment you must log in.
This report contains Public information  Edit
Everyone can see this information.

Other bug subscribers