Fix Large Black Borders Around Header Bar Apps With Some Themes In Ubuntu 15.10 (GTK 3.16)

In Ubuntu 15.10 (which uses GTK 3.16), there's a bug which causes some themes, like Numix, to have large black borders.

This bug only occurs for applications that use header bars (client-side decorations) and it affects Ubuntu (with Unity), while Xubuntu, Ubuntu MATE and Ubuntu GNOME don't seem to be affected (at least in my quick test). Update: MATE with Compiz enabled is also affected so I guess any desktop environment under which you use Compiz is affected (thanks to pawelp!).

Here's a screenshot with GNOME Clocks (an app that uses header bars) under Unity (Ubuntu 15.10), using Numix GTK theme:

I'm not sure when/if this bug will be fixed but until then, you can fix it yourself. Below you'll find a simple fix which will remove the black borders no matter what GTK theme you're using.

To fix the large black borders bug in Ubuntu, open ~/.config/gtk-3.0/gtk.css (create the ~/.config/gtk-3.0 folder if it doesn't exist) with a text editor (I'll use Gedit below):

mkdir -p ~/.config/gtk-3.0
gedit ~/.config/gtk-3.0/gtk.css

and in this file, add the following:

.window-frame {
box-shadow: none;
margin: 1px;
}

This forces any theme you use to have a 1 pixel border. You can use any value you want - for instance, use "0" for borderless windows.

Then save the file and close all the applications affected by the black border bug (or you can log out and log back in), then try them again and you shouldn't see large black borders any more.

Here's the same application I've used above to show the bug (GNOME Clocks, running under Unity), after applying the fix:

Thanks to Phaeilo @ GitHub for the fix!