A user css to display the url when a link is hovered

Created by Michael Moroni on on 2011-06-01
Keywords:

This user css is used to display the corresponding url when a link is hovered. This is similar to what chromium/chrome provides when hovering over a link, shown on the bottom left of the page. Add the following to ~/.local/share/midori/styles, then restart Midori and make sure that it is enabled Tools → Userstyles.

Customize as needed:

a[href]:hover {
            text-decoration: none !important;
        }
        a[href]:hover:after {
            content: attr(href);
            position: fixed; left: 4px; bottom: 4px;
            padding: 0 6px !important;
            max-width: 95%; overflow: hidden;
            white-space: nowrap; text-overflow: ellipsis;
            font:10pt sans-serif !important; text-shadow: 0 0 12px white;
            background-color: ButtonFace !important; color: ButtonText !important;
            opacity: 0.8; outline: ButtonFace solid thick;
            z-index: 9999;
        }