I created a website featuring a 3D graphical project using three.js.
After spending a few hours searching on Google, I came across the following widely-used source code for creating a gradient background-color:
html {
width: 100%;
height: 100%;
background: #11e8bb; /* Old browsers */
background: -moz-linear-gradient(top, #11e8bb 0%, #8200c9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #11e8bb 0%,#8200c9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #11e8bb 0%,#8200c9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#11e8bb', endColorstr='#8200c9',GradientType=0 ); /* IE6-9 */
}
Most examples work fine with simply setting linear-gradient to the background property. However, in my case, it does not work as expected.
The code snippet in question is located in my [index.html] file:
[contents of index.html]In addition, there is a JavaScript file [src.js] that contains several functions and scripts used to define variables and functionality within the website.
Despite implementing the code and defining the background color in my HTML, the gradient effect is not displaying correctly. Any ideas or solutions would be greatly appreciated.
Thank you.