Force Scrollbar On Safari

Is there a way to force the vertical scrollbar to show on Safari Lion. It only shows if you click the far right of a page. I have an element where I have overflow-y:auto but in Sa

Solution 1:

Ok found this online at this site http://css-tricks.com/custom-scrollbars-in-webkit/ This will make it show up in Safari Lion

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 8px;
}

::-webkit-scrollbar-track {
    background-color: rgba(57,57,57, .6);
    border-radius: 8px;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: rgba(156, 156, 156, .6);
}

Obviously you will need to change the properties to suite what you want. Again this is for Safari as overflow-y: scroll; does not force it to show.

If you want to assign this to a scrollbar on a specific element, you can add any css selector before:

.mydiv::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 8px;
}

.mydiv::-webkit-scrollbar-track {
    background-color: rgba(57,57,57, .6);
    border-radius: 8px;
}

.mydiv::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: rgba(156, 156, 156, .6);
}

Solution 2:

Apply the overflow-y to the html element. html { overflow-y:scroll; }