Okay so umm how do you show and hide the navbar text/icons based on screen size in just CSS? here is the navbar stuff kinda:
<a href="/" class="desktop">Home</a>
<a href="/" class="mobile">insert icon here</a>how to I show the mobile one and hide the desktop one and the other way around for desktop?
comments
::before
oh right i misread it, yeah you want media queries
why did you make random note, plez delete as I can not
in the website with the stuff I found
I was talking about the storage website
oh that
Use media queries
Um so Smth like this (assuming 800px is min desktop width)
.mobile, .desktop {
display: hidden;
}
@media screen and (max-width: 800px) { /* this checks for small screens=mobile. So apply mobile style. */
.mobile {
display: inline; /*default for <a> tag*/
}
}
/* make another media query but with min-width: 800px for showing desktop elements */