How to make gaps on the bookmarks bar?

[RadekPilich]

Is it possible / or what is some good tip to create a gap on the bookmarks bar?

Primarily (shown below), I would like to move the start of the bookmark section away from the corner of the screen, more towards the middle.

Secondarily, I would also like to have gaps between sections of bookmarks - i.e. 3 folders next to each other and then a gap with width of around two folders.... then another 3, then another gap....

[Pesala]

@RadekPilich Use a space either side of the separator. Use a flexible space on the left to use all available space, and push the folders/bookmarks to the right.

Right-click on the toolbar to customise it.

[RadekPilich]

@Pesala Yeah, nice, but that cannot be used on bookmarks toolbar, can it?

[Pesala]

@RadekPilich My mistake. The Bookmark Bar is not editable like that.

[RadekPilich]

@Pesala Is that "a chromium thing", Vivaldi can do nothing about?

[Pesala]

@RadekPilich The UI is independent of the page rendering Chromium code. The Vivaldi Team can do pretty much want they want to the UI, given enough time and resources.

While you are waiting, head over to the Modifications Forum to see if there are any existing workarounds.

[LonM]

If you are happy to experiment with modifications, this is fairly easy with a custom CSS file:

.bookmarkbarItem:nth-child(1) {
    margin-left: 50px
}
.bookmarkbarItem:nth-child(3) {
    margin-right: 50px
}

Where "(3)" means the 3rd item, and "50px" is how much space to add. You can copy and make as many rules as you like, and change the spacing on the left and the right.

If you're willing to try, you can get instructions on how to set up this kind of modification here: https://forum.vivaldi.net/topic/10549/modding-vivaldi?page=1

[barbudo2005]

@RadekPilich

Also you can use this:

.bookmarkbarItem:nth-child(8)

 {margin-left: 25px !important;
 margin-right: 25px !important;}
 
 .bookmarkbarItem:nth-child(8)::after,
 .bookmarkbarItem:nth-child(8)::before

{content: " | " !important;
font-size: 20px !important;}

[guigirl]

I'll see your 6 lines, then raise you 7 lines. I reckon you're bluffing; Call!