Reduce nav-bar width

  • Hi folks, I've been playing about with the idea of reducing my complete nav-bar width as I dont need a url bar about 5 metres long :p. Now, I can achieve reducing its width of course without a problem, but there are two problems that I'm struggling with, firstly it is ALWAYS attached to the left side (I'd like it right side or in the middle, like beyond australis on firefox). Secondly when I do reduce the nav-bar/tool-bar there is another element underneath leaving a grey bar making the whole experiment pointless, I'm struggling to work out what exactly this is! as it doesn't allow me to inspect the element. Any pointers would be hugely appreciated. Sean

  • Moderator

    Whoa! You've got a 5-metre display? Kudos! I'm jealous!

  • Haha, only a slight exaggeration 😉

  • See below

  • I've done it for anybody interested!

    .toolbar-addressbar {
    visibility: hidden;
    position: fixed;
    opacity: 0;
    z-index: 2;
    transition: opacity .3s linear .7s, visibility 0s linear 1s;
    width: 50%;
    left: 25%;
    right: 25%;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    background: #303541 !important;
    border-bottom: 1px solid #222 !important;
    border-left: 1px solid #222 !important;
    border-right: 1px solid #222 !important;
    #header:hover ~ #main .toolbar-addressbar,
    .toolbar-addressbar:hover {
    visibility: visible;
    opacity: 1;
    transition-delay: 0s;

    This places it center, left: 50% and zero on right fixes to right of screen 🙂

    And here is how it looks, it auto-hides though:


Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.