Greetings to all! I have successfully created a navbar similar to apple.com for phone screens that works perfectly on Safari and Chrome.
You can find the code on jsfiddle.
The main CSS used is as follows:
ul::-webkit-scrollbar {
display: none;
}
ul{
margin: 0px;
padding: 0px;
height: 70px;
list-style-type:none;
white-space:nowrap;
overflow-x:auto;
font-size: 0px;
}
li{
display:inline-block;
background-color: gray;
font-size: 20px;
margin: 0px;
padding: 0px;
}
The scrollbar on X axis can be hidden on Chrome and Safari, but not on Firefox.
Is there a way to fix this and make it work on Firefox?
If you have any solutions, please share them with me. Thank you so much.