Long space between title and the top of the page

Things I have tried

Back spacing and looking in my plugins to see if a plug in is making this long space.

What I’m trying to do

I lost the previous set up for Obsidian by mistake. I think I could have retrieved it. Anyway, now I have a long space between the title and the top of the page. I think the text is located in the center of the page. But this is a waste of space.

Are you running a theme? (if so, disable the theme and see if that fixes it)

Have you tried fixing it with CSS?

No, disabling the theme did not work. I don’t know CSS. But, I wish I did.

Zenmoto was inferring that there is no space by default, so you must have something creating a large space at the top.

1 Like

@Obsindandnancy @ZenMoto

I tried removing plugin that could be remotely connect. Did not help. Maybe I should remove everything. I wish there were an easy way to do this.

It was the Typewriter scroll plug in. It has a setting to toggle off the empty long top of the page. Whew. Thank you @Obsindandnancy and @ZenMoto

1 Like

Good job finding the fix!

“I don’t know CSS. But, I wish I did.”

That’s okay - everyone was clueless about CSS at one point, and it’s easier than it looks (actually it’s really fun).

CSS lets you change the color and position of everything you see.

For example, to change the background color of Obsidian’s bottom bar (status bar), you just add:

/* status color */
.status-bar { background-color: black; }

^
/* status color */ is a comment (the computer doesn’t read it. It’s just to help you remember what the code does).

.status-bar is the target element (the item you want to change with CSS).

Everything between { and } is the declaration. This is where you define what you want to change.

Each declaration changes one property. For example:
{font-size: 22px;} changes text size,
{color: red !important;} changes text color (sometimes you have to add !important like that to force the CSS to change).


HOW TO CHANGE CSS:

You can see all the CSS that’s affecting the appearance of Obsidian right now - click “View” in the top menu, then “Show developer tools”. This opens a new window (dev tools).

In the top-left of the new window is a little arrow icon. Click that little arrow and then select something in the Obsidian app.

When you do that, the dev tools window shows the code for the element you selected (in the left pane), and all the declared CSS properties of that element (in the right pane).

You can play around in dev tools by clicking different elements to learn about CSS.

You can also temporarily change the CSS properties right there in developer tools, to see how changes will look. But these changes are temporary, when you restart Obsidian, they will reset.

To make a permanent CSS change, you have to add your changes to a “snippets.css” document in vault/.obsidian/snippets/snippets.css (you can get to that folder by going to the ‘Appearance’ tab in Obsidian settings, and clicking the little folder icon next to “CSS snippets” at the bottom.


It’s pretty fun to play around with CSS because you can change the appearance of everything in Obsidian.

In your case, the property that was adding space was probably “padding-top”. The element was probably “CodeMirror-lines”.

If so, you would change it with:

/* eliminate all space above text */
.CodeMirror-lines {padding-top: 0px;}

I wrote all this because CSS is a fun way to get into coding, and I see you want to learn.

Play around in the dev tools (you won’t permanently break anything) and you will probably love it :slight_smile:

If you have any questions, feel free to ask.

I would reinstall the typewriter plugin, then turn off that top margin.

You don’t need to do any CSS.

The plugin probably left a css snippet in your obsidian vault folder, but if you don’t want to find it, its easier to use the plugin to fix the issue.

Thank you both for your intelligent feedback.
@ZenMoto I actually looked at view. I now see where I could adjust the long space.
and @Obsidandncy I will try turning on the typewriter plug in and look for that top margin with out CSS. But thanks to @ZenMoto I will look at the CSS if necessary. It is all within common sense.

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