(The styling works on all browsers except Chrome)
I am trying to apply a specific style only when the browser width is less than 1400px
Unfortunately, using max-width is not producing the desired effect
@media only screen and (max-width:1400px) {
.heading-left {
left: -0.5%;
}
}
When using min-width, the styling works as intended
@media only screen and (min-width:480px) {
.heading-left {
left: -0.5%;
}
}
However, the style also changes when the browser width is above 1400px, which is not the desired outcome (I understand this is how it works, but the max-width is not working as expected)
Link to the Fiddle: