# Top bar improve for mobile view
**URL:** https://community.silverbullet.md/t/top-bar-improve-for-mobile-view/985
**Category:** Tricks & Techniques
**Created:** [September 12, 2024, 5:13am UTC](https://community.silverbullet.md/t/top-bar-improve-for-mobile-view/985 "2024-09-12T05:13:25Z")
**Posts on this page:** 4
**Page:** 1
### Author:  [@vuau](https://community.silverbullet.md/u/vuau)
#### Post date: [September 12, 2024, 5:13am UTC](https://community.silverbullet.md/t/top-bar-improve-for-mobile-view/985/1 "2024-09-12T05:13:26Z")
The page name is not readable in small screen devices if it is too long. So I made a small tweak using space-style
```space-style
@media only screen and (max-width: 480px) {
#sb-top {
height: auto;
}
#sb-top .main .inner .wrapper {
flex-direction: column;
}
}
```
Result
---
### Author:  [@zef](https://community.silverbullet.md/u/zef)
#### Post date: [September 12, 2024, 8:59am UTC](https://community.silverbullet.md/t/top-bar-improve-for-mobile-view/985/2 "2024-09-12T08:59:55Z")
Nice. I would really like to get to a solution that uses less vertical space on mobile. Perhaps the hamburger menu idea would be nicer. [When viewing Silverbullet on mobile and there are more than a few buttons on the header, the page name is very truncated · Issue #1033 · silverbulletmd/silverbullet · GitHub](https://github.com/silverbulletmd/silverbullet/issues/1033)
---
### Author:  [@vuau](https://community.silverbullet.md/u/vuau)
#### Post date: [September 12, 2024, 9:11am UTC](https://community.silverbullet.md/t/top-bar-improve-for-mobile-view/985/3 "2024-09-12T09:11:10Z")
Actually I wanted to make some effects like hiding the action buttons when scrolling down and showing them when scrolling up. However it would required some JS that I don’t have time to write for now.
---
### Author:  [@vuau](https://community.silverbullet.md/u/vuau)
#### Post date: [September 14, 2024, 12:59pm UTC](https://community.silverbullet.md/t/top-bar-improve-for-mobile-view/985/4 "2024-09-14T12:59:31Z")
Like this
