Create draggable area on view-header or similar area which allows title to remain

hey there,

currently trying to work something out re CSS snippets.

i recently installed a plugin so i could have vertical tabs, this frees up the top of the window and makes the tabs easier to read.

one unintended consequence is that there’s much less draggable area for moving the obsidian window around. i found this thread which gave a useful answer re creating a draggable area, which does indeed work, so i wrote something like this:

.workspace-ribbon, .view-header {
-webkit-app-region: drag;

and it works, however when enabled the title of the page folder/title just vanishes. the .view-header area is now draggable, but i’d ideally like to be able to see the folder/title as normal too. nb. im not sure if view-header is the appropriate class to use as draggable, please let me know if there’s a better one.

what CSS am i missing/overwriting that i need to take account of so that the top is draggable, and everything continues to fade in/out as normal?


Out of curiosity, is this the plugin?

EDIT: maybe not that plugin, or not only that plugin?

Here’s with the Vertical tabs view plugin and Hider plugin hiding the tab bar. This CSS seems to cover the dragging alright.

.view-header {
    -webkit-app-region: drag;


If you let us know exactly how you set it up, what plugins, theme and settings, other CSS, etc., maybe someone can spot something.