Help Scrolling help?

[Elowyn]

Hi!

So I have a question: How do I make scroll bars prettier with code or get ride of them entirely?
I hate the clunky rectangular scroll bars you find for example on the internet window tab.

Thanks in advance.​

 

[StoneWolf18]

This might help you out! ^^

Here's a version of it that's a bit simpler. It only uses two divs and doesn't need any transforms. It works by making the inner div's width slightly more than the outer div's, which cuts the bar off. Since the bar is 17px wide, an extra 17px to the width would cut it off completely, while something less than that will leave a small scrollbar. The arrows won't be there, though, and it still suffers from being mobile unfriendly.

Duis convallis rhoncus tellus in porta. Phasellus vitae nisl venenatis, ullamcorper tortor a, pulvinar erat. Sed commodo sollicitudin sapien, non hendrerit mi vehicula commodo. Vivamus eleifend egestas tempus. Vivamus ultrices faucibus nisi, et pellentesque velit posuere mattis. In hac habitasse platea dictumst. Pellentesque ut posuere erat. Donec tristique leo sem, id commodo sem maximus in. Mauris congue cursus nisi, eu luctus ligula mollis eu. Pellentesque ac augue eu ligula ullamcorper lacinia dictum non lectus. Nunc ac sem lorem.

Maecenas fringilla justo sit amet tortor placerat pulvinar nec tempus magna. Aliquam consectetur pretium faucibus. Mauris convallis, tortor vel ullamcorper gravida, lectus ligula accumsan neque, quis varius eros felis in ex. Ut dictum nunc massa, quis accumsan nulla feugiat sed. Nullam vel erat vitae urna mattis interdum. Integer non ultricies erat. Suspendisse mattis pellentesque venenatis. Mauris auctor est pulvinar, euismod dolor eu, convallis libero.

[div=width: 300px; height: 300px; overflow: hidden; background: #f1f1f1;][div=
width: calc(100% + 13px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; padding: 3% 7%; text-align: justify;]Duis convallis rhoncus tellus in porta. Phasellus vitae nisl venenatis, ullamcorper tortor a, pulvinar erat. Sed commodo sollicitudin sapien, non hendrerit mi vehicula commodo. Vivamus eleifend egestas tempus. Vivamus ultrices faucibus nisi, et pellentesque velit posuere mattis. In hac habitasse platea dictumst. Pellentesque ut posuere erat. Donec tristique leo sem, id commodo sem maximus in. Mauris congue cursus nisi, eu luctus ligula mollis eu. Pellentesque ac augue eu ligula ullamcorper lacinia dictum non lectus. Nunc ac sem lorem.

Maecenas fringilla justo sit amet tortor placerat pulvinar nec tempus magna. Aliquam consectetur pretium faucibus. Mauris convallis, tortor vel ullamcorper gravida, lectus ligula accumsan neque, quis varius eros felis in ex. Ut dictum nunc massa, quis accumsan nulla feugiat sed. Nullam vel erat vitae urna mattis interdum. Integer non ultricies erat. Suspendisse mattis pellentesque venenatis. Mauris auctor est pulvinar, euismod dolor eu, convallis libero.[/div][/div]

 

[IctoraPost]

This might help as well.

Actually, instead of putting the padding on the child box, all you have to do is put the padding in the parent box. o: Just make sure you adjust the width/height according to accommodate it (aka, if you want the width/height to be 300 x 300, put it as 280 x 280 instead for a 10px padding). You can use the calc function if you're working with percentages. Just remember that not putting the spacing [calc(50%-20px) vs calc(50% - 20px)] can mean the difference of it working or not.

And yes, this works on mobile w/o weird cut-offs c:

Wild New World (also known as Prehistoric America) is a six-part BBC documentary series about Ice Age America - which discover the prehistory landscape and wildlife from the arrival of humans to the end of the Ice Age. It was first transmitted in the UK on BBC Two from 3 October to 7 November 2002. Like several other BBC programmes, it contains both computer graphics and real life animals. Occasionally, footage of non-American counterparts of the extinct North American beasts (like the American lion and the giant American cheetah) are used in juxtaposition with footage of native American animals, like the pronghorn.

Wild New World was co-produced by the BBC Natural History Unit and Discovery Channel. The music was composed by Barnaby Taylor and performed by the BBC Concert Orchestra. The series was narrated by Jack Fortune and produced by Miles Barton.

The series forms part of the Natural History Unit's Continents strand. It was preceded by Wild Africa in 2001 and followed by Wild Down Under in 2003.

Wild New World (also known as Prehistoric America) is a six-part BBC documentary series about Ice Age America - which discover the prehistory landscape and wildlife from the arrival of humans to the end of the Ice Age. It was first transmitted in the UK on BBC Two from 3 October to 7 November 2002. Like several other BBC programmes, it contains both computer graphics and real life animals. Occasionally, footage of non-American counterparts of the extinct North American beasts (like the American lion and the giant American cheetah) are used in juxtaposition with footage of native American animals, like the pronghorn.

Wild New World was co-produced by the BBC Natural History Unit and Discovery Channel. The music was composed by Barnaby Taylor and performed by the BBC Concert Orchestra. The series was narrated by Jack Fortune and produced by Miles Barton.

The series forms part of the Natural History Unit's Continents strand. It was preceded by Wild Africa in 2001 and followed by Wild Down Under in 2003.

[div=position: relative; width: calc(40%  - 20px);height: 180px; overflow: hidden; background-color: #fdf9f7; padding: 10px;][div=width: 100%; padding-right: 150px; height: 100%; overflow-y: scroll; color: gray; font-size: 0.9em; font-align: justify;][font=Poppins]Wild New World (also known as Prehistoric America) is a six-part BBC documentary series about Ice Age America - which discover the prehistory landscape and wildlife from the arrival of humans to the end of the Ice Age. It was first transmitted in the UK on BBC Two from 3 October to 7 November 2002. Like several other BBC programmes, it contains both computer graphics and real life animals. Occasionally, footage of non-American counterparts of the extinct North American beasts (like the American lion and the giant American cheetah) are used in juxtaposition with footage of native American animals, like the pronghorn.

Wild New World was co-produced by the BBC Natural History Unit and Discovery Channel. The music was composed by Barnaby Taylor and performed by the BBC Concert Orchestra. The series was narrated by Jack Fortune and produced by Miles Barton.

The series forms part of the Natural History Unit's Continents strand. It was preceded by Wild Africa in 2001 and followed by Wild Down Under in 2003.[/font][/div][/div]