Responsive design and viewport not working through domain's "frameset."

Question

I'm working on a responsive design site and ran into a fairly large snag. I used viewport code:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />

and used:

@media only screen and (min-width: 501px) and (max-width: 930px)  {

CSS HERE}

as needed. When I put my index page on my host server to check it the site wouldn't respond to changes between my mobile devices. I tried my domain name site- didn't work. Turns out the domain name points to my sever and displays the site in a <frameset> and canceling out my CSS and meta. When I go to the native web address of the server it works properly. Is there anyway around this?

Pericarditis

Is anyone likely to visit your site on that URL? Is there any setting within your hosting to redirect any users to your native web address? Also I'm not sure if I'm completely understanding the issue you are having, could you include the URL's and a bit more background. – Guimpe

I set up a responsive design site which uses the client's viewport to determine how the site is configured. It turned out my domain name was forwarding with masking and the CSS was 'reading' the frame as the viewport. disaster averted. – Pericarditis

Do you mind answering your own question and mark it as done? – Guimpe

I had the same problem. Here's more help here: #4210655 – Caryncaryo

Answer 1

I set up a responsive design site which uses the client's viewport to determine how the site is configured. It turned out my domain name was forwarding with masking and the CSS was 'reading' the frame as the viewport. disaster averted.

Pericarditis

How did you solve this? I am currently having the same issue. Did you find a way to make it work within the frame or did you just change the way that it was forwarding to do so without a frame/masking? – Thermomotor

Answer 2

SOLVED - I have found a solution using a well know hacking technique to inject the relevant code (without actually hacking anything!).

I have my domain name at 123-reg.co.uk and free webspace at freehostingEU, with framed web forwarding on 123-reg.co.uk to maintain my domain name in the free space. To solve the problem of the frame blocking the viewport meta tag on the site, go into the web forwarding options in somewhere like 123-reg.co.uk where you can usually set your meta title, meta desc, meta author etc, and inject the following code into one of the boxes where you are allowed to enter some meta data for your framed page e.g. meta author and insert:-

 your-author-name"><meta name="viewport" content="width=device-width, initial-scale=1.0,

which will then put the viewport code into the frame forwarding page straight after the meta author. And it works, because I have just done it on 123-reg and it works great!

Branching

Thanks so much. This worked great for my no-ip.com masked URL service. – Selestina

Answer 3

This site finally explained how I could do this to me. Now when you visit mydomain.com it forwards to www.mydomain.com which in turn links to my azure server. The domain remains in the url without frames/masking i.e it shows the url I bought want, not the azure one.

http://blog.smarx.com/posts/custom-domain-names-in-windows-azure

From the link:

Add the CNAME record

Step one is to create a CNAME record mapping the “www” subdomain (as in www.botomatic.com) to my Windows Azure application (botomatic.cloudapp.net)

Forward the root domain

Step two is to use domain forwarding to map the root domain (botomatic.com) to the subdomain we already mapped (www.botomatic.com).

Hanks