3 ms·

I visit my own site mostly with Firefox on Mac OS X. While I do look at it on iOS and Android from time to time, not a whole lot, as I can't actually _work_ on

I visit my own site mostly with Firefox on Mac OS X. While I do look at it on iOS and Android from time to time, not a whole lot, as I can't actually _work_ on my site from a mobile device. The mobile view of my site, admittedly, sucks. The main thing I do is hide the extensive vertical navigation bar on the right side of the desktop view, I hide the logo, then place a very compact navigation bar at the top. I realized just yesterday that there are some styles in my desktop view that are not reflected in the mobile stylesheet, like "picture frames" around images. I can easily fix that. What I'd like to know, is how to make my site not suck, for those with mobile gadgetry. I use just one HTML document for each page of both the mobile and desktop view of my site, with a separate stylesheet for screens that are less than 481 pixels. Internet Explorer doesn't understand how that's done, so I have: <link media="only screen and (max-device-width: 480px)" href="/css/mobile-manual.css" type="text/css" rel="stylesheet" /> <link media="screen and (min-device-width: 481px)" href="/quixotic.css" type="text/css" rel="stylesheet" />