Currently, I am working on implementing media queries to customize the color scheme for different screen sizes - particularly in 1024 view and 768 view. However, one issue that I encountered is that the properties defined for the 1024 view are being inherited by the 768 view as well.
@media only screen and (max-width: 768px) {
.cashBalance {
font-size: 50px !important;
color: green !important;
margin-left: -20px !important;
}
}
@media only screen and (max-width: 1024px) {
.cashBalance {
font-size: 65px;
color: red !important;
}
}
To see the code in action, you can visit my CodePen link here: https://codepen.io/SahilKatia/pen/ejqjjJ