After using CSS for a considerable amount of time, I have successfully utilized the @import rule in the past. However, I am currently encountering an issue with it on a new project. Is there anyone who can offer assistance? Here is the code:
@import url('media.css');
nav ul{
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
list-style: none;
}
.burger{
align-self: center;
display: flex;
flex-direction: column;
width: fit-content;
height: fit-content;
cursor: pointer;
}
Below is the content of the imported file (media.css):
@media screen and (width <= 600px){
nav ul{ display: none;}
.burger{ display: flex;}
}
I have resorted to adding a CSS link in the HTML file as a workaround solution since it seems to be the only thing that works.