Not Responsive by default - dotAwesome theme
Permalink Browser Info Environment
Hi,
I have posted a support question about the fact that this theme was supposed to be responsive but was not (chrome and IE9).
I did not get a response yet.
I have been looking at the code and found some errors related to css
First, in the top.php file (inc dir)
It should read:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0," />
and not
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
And it the igotstyle.css the mediaquery statements are wrong
They should be like:
@media screen and (max-width: 480px) {
and not like
@media screen and (max-device-width: 480px) {
That seems to trigger the responsive design for me and it looks almost right. Will probably need to tweeking but it is not bat at all.
I have posted a support question about the fact that this theme was supposed to be responsive but was not (chrome and IE9).
I did not get a response yet.
I have been looking at the code and found some errors related to css
First, in the top.php file (inc dir)
It should read:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0," />
and not
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
And it the igotstyle.css the mediaquery statements are wrong
They should be like:
@media screen and (max-width: 480px) {
and not like
@media screen and (max-device-width: 480px) {
That seems to trigger the responsive design for me and it looks almost right. Will probably need to tweeking but it is not bat at all.
| Type: | Discussion |
|---|---|
| Status: | New |
I usually just resize my window to preview a site for different sizes and was befuddled as to why it wasn't responsive. Tried it on the phone and saw it was working correctly. I feel that when someone resizes a window on a desktop it is to be able to see two things at once and would like to see the window resized.
I'll have to rethink this.
I'll have to rethink this.
I'm not sure I see the difference in your meta code, but it seems to work fine on all devices as we have it.
The max-width vs max-device-width are NOT wrong. They're exactly what we wanted.
We do not believe that when you view a website on a 1280 resolution, that when that when the average users resizes the browser window that they expect the website to shift, and sometimes even get misplaced on where they were reading.
So we go by DEVICE width. So when you're using a monitor/screen that's at 940 or so (tablets), the website resizes properly for that screen width.
We believe that's really the way it should be done. A user doesn't expect a website to resize in a responsive manner all the way down to mobile stylesheets when they're using a desktop. That's just eye candy for other web designers :)