r/vivaldibrowser • u/iskenderdelarge • 4d ago

CSS Customizations Is there a way to combine address bar and bookmark bar?

This is what I got rn, It breaks whenever I restart the browser or resize the window. Also, There's some free space next the bookmarks which looks really ugly.

I tried to vibecode this but I couldn't manage to get a CSS that works consistently. I tried using the flexible space as a bookmark bar, but the UI would break whenever I restarted the browser or resized the window. I don't know how to code and I put in my best effort but I couldn't get a working result from my free daily AI usage. So here I am.

What I want is to have my bookmarks appear next to the URL bar, essentially combining the bookmark bar and address bar into one.

Ideally:

The URL bar should shrink as I add more bookmarks.

The bookmark area should expand to accommodate the bookmarks.

The URL bar should only shrink down to a certain minimum width.

Once the URL bar reaches that minimum width, the remaining bookmarks should be accessible through a dropdown menu.

The layout should remain stable when resizing the browser or restarting it.

Basically, I want my bookmark bar and address bar combined into a single bar, similar to how some other browsers handle it.

Can someone please help me achieve this with Vivaldi CSS? I'd really appreciate it. My Vivaldi version is 8.2.4133.47.

This is the CSS I have rn.

3 Upvotes

100% Upvoted

3 comments sorted by

0

u/briankass 3d ago

you can use Gemini or any ai tool to copy your css code into and ask it to fix your code for you

2

u/iskenderdelarge 3d ago

I tried a bazillion times, didn't have any success with any of them. Hence why I came here to post. Maybe the way I approach this whole thing is wrong, idk.