Hi, everyone,
I’m having an issue with a web page hosted on my GitHub account and the same webpage hosted on CodePen showing up vastly different. Can you tell me why this is?
Here are the web pages: https://mtzioncode.github.io, and https://codepen.io/IDCoder/pen/OWbXLw?editors=1000
Here is the link to my HTML and CSS sheets at GitHub: https://github.com/MtZionCode/MtZionCode.github.io/blob/master/index.html and https://github.com/MtZionCode/MtZionCode.github.io/blob/master/styles.css
The new code that I added to each one are: <div class="glass"> </div> in the HTML sheet and below in the CSS sheet:
`.glass{
width: 100%;
height: 50%;
/background-color: rgb(255,255,255,0.2);/
background: rgba(113,206,239,0.41);
background: -webkit-linear-gradient(top, rgba(113,206,239,0.41) 33%, rgba(33,180,226,0.41) 51%, rgba(183,222,237,0.41) 100%, rgba(183,222,237,0.41) 97%, rgba(183,222,237,1) 100%);
background: -o-linear-gradient(top, rgba(113,206,239,0.41) 33%, rgba(33,180,226,0.41) 51%, rgba(183,222,237,0.41) 100%, rgba(183,222,237,0.41) 97%, rgba(183,222,237,1) 100%);
background: -ms-linear-gradient(top, rgba(113,206,239,0.41) 33%, rgba(33,180,226,0.41) 51%, rgba(183,222,237,0.41) 100%, rgba(183,222,237,0.41) 97%, rgba(183,222,237,1) 100%);
background: linear-gradient(to bottom, rgba(113,206,239,0.41) 33%, rgba(33,180,226,0.41) 51%, rgba(183,222,237,0.41) 100%, rgba(183,222,237,0.41) 97%, rgba(183,222,237,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#71ceef’, endColorstr=’#b7deed’, GradientType=0 );
/* for the following elements, rgba(183,222,237,0.41) 78%, 78% was changed to 100% */
position: absolute;
top: 0;
/border-radius: 20px;/
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}
`