Responsive website redirected in iframe isn't responsive
I have multiple domains who redirect to the same responsive website by iFrame.
The problem is, when I visit these website's on a mobile device, it's not longer responsive.
The original website, http://m.isero.nl/, works perfect.
But it's not longer responsive when I use a domain who redirect by frame, like http://iseroijzerwarengroep.be/.
How can I make this website responsive to mobile devices inside an iFrame?
I tried this in my css:
iframe, object, embed
width: 100%;
height: auto;
But no success.
html css redirect iframe responsive-design
asked Feb 21 '14 at 13:55
DlennartDDlennartD
264
add a comment |
I have multiple domains who redirect to the same responsive website by iFrame.
The problem is, when I visit these website's on a mobile device, it's not longer responsive.
The original website, http://m.isero.nl/, works perfect.
But it's not longer responsive when I use a domain who redirect by frame, like http://iseroijzerwarengroep.be/.
How can I make this website responsive to mobile devices inside an iFrame?
I tried this in my css:
iframe, object, embed
width: 100%;
height: auto;
But no success.
html css redirect iframe responsive-design
asked Feb 21 '14 at 13:55
DlennartDDlennartD
264
iframes are old and bad.. especially in your case.. please do not "redirect" with iframe.. you should use .htaccess or other server settings to do this.
– Hardy
Feb 21 '14 at 13:58
@Hardy You're confusing frames and iframes. Granted, iframes certainly have their issues but sometimes they are the only choice. Frames are pretty much never a good choice.
– patricksweeney
Feb 21 '14 at 14:49
add a comment |
I have multiple domains who redirect to the same responsive website by iFrame.
The problem is, when I visit these website's on a mobile device, it's not longer responsive.
The original website, http://m.isero.nl/, works perfect.
But it's not longer responsive when I use a domain who redirect by frame, like http://iseroijzerwarengroep.be/.
How can I make this website responsive to mobile devices inside an iFrame?
I tried this in my css:
iframe, object, embed
width: 100%;
height: auto;
But no success.
html css redirect iframe responsive-design
asked Feb 21 '14 at 13:55
DlennartDDlennartD
264
I have multiple domains who redirect to the same responsive website by iFrame.
The problem is, when I visit these website's on a mobile device, it's not longer responsive.
The original website, http://m.isero.nl/, works perfect.
But it's not longer responsive when I use a domain who redirect by frame, like http://iseroijzerwarengroep.be/.
How can I make this website responsive to mobile devices inside an iFrame?
I tried this in my css:
iframe, object, embed
width: 100%;
height: auto;
But no success.
html css redirect iframe responsive-design
html css redirect iframe responsive-design
asked Feb 21 '14 at 13:55
DlennartDDlennartD
264
asked Feb 21 '14 at 13:55
DlennartDDlennartD
264
edited Feb 21 '14 at 14:30
user3337602
asked Feb 21 '14 at 13:55
DlennartDDlennartD
264
asked Feb 21 '14 at 13:55
DlennartDDlennartD
264
asked Feb 21 '14 at 13:55
DlennartDDlennartD
264
264
iframes are old and bad.. especially in your case.. please do not "redirect" with iframe.. you should use .htaccess or other server settings to do this.
– Hardy
Feb 21 '14 at 13:58
@Hardy You're confusing frames and iframes. Granted, iframes certainly have their issues but sometimes they are the only choice. Frames are pretty much never a good choice.
– patricksweeney
Feb 21 '14 at 14:49
add a comment |
iframes are old and bad.. especially in your case.. please do not "redirect" with iframe.. you should use .htaccess or other server settings to do this.
– Hardy
Feb 21 '14 at 13:58
@Hardy You're confusing frames and iframes. Granted, iframes certainly have their issues but sometimes they are the only choice. Frames are pretty much never a good choice.
– patricksweeney
Feb 21 '14 at 14:49
iframes are old and bad.. especially in your case.. please do not "redirect" with iframe.. you should use .htaccess or other server settings to do this.
– Hardy
Feb 21 '14 at 13:58
iframes are old and bad.. especially in your case.. please do not "redirect" with iframe.. you should use .htaccess or other server settings to do this.
– Hardy
Feb 21 '14 at 13:58
@Hardy You're confusing frames and iframes. Granted, iframes certainly have their issues but sometimes they are the only choice. Frames are pretty much never a good choice.
– patricksweeney
Feb 21 '14 at 14:49
@Hardy You're confusing frames and iframes. Granted, iframes certainly have their issues but sometimes they are the only choice. Frames are pretty much never a good choice.
– patricksweeney
Feb 21 '14 at 14:49
add a comment |
2 Answers
2
active
oldest
votes
The problem is that your parent sites don't have the appropriate viewport meta-tag in the <head>. That tag is present in the child site:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
answered Feb 21 '14 at 14:24
Stephen ThomasStephen Thomas
10.1k21733
1
True, but I don't have access to the parent sites head part, can't I solve this in the child site?
– DlennartD
Feb 26 '14 at 11:24
1
An iframe cannot modify it's parent (unless the parent is coded to permit it)
– Stephen Thomas
Feb 26 '14 at 11:30
then what's the solution ?
– Muhammad
Sep 7 '15 at 11:31
add a comment |
Create a .php document and upload it to your hosting. Don't create a frame forward in your domain setting, but point the domain to the created .php document. Then use the following code in your .php document to create the frame forward there.
<html>
<head>
<title>Your Title</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-
scale=1.0; user-scalable=0">
<link rel='shortcut icon' type='image/x-icon' href='/favicon.ico' />
</head>
<frameset rows="100%" border="0" framespacing="0" frameborder="0">
<frame name="main" src="https://your-target-domain.com/" marginwidth="0"
marginheight="0" scrolling="auto"
noresize="noresize">
</frameset>
<noframes>
</noframes>
</html>
I created a link to a favicon as well. You can take this line out if you dont need it. If you need it, simply upload your favicon as "favicon.ico" into the same directory as the .php file.
Now you have a mobile responsive frame forwarding :)
answered Nov 14 '18 at 10:55
TimmTimm
1
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f21936412%2fresponsive-website-redirected-in-iframe-isnt-responsive%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
The problem is that your parent sites don't have the appropriate viewport meta-tag in the <head>. That tag is present in the child site:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
answered Feb 21 '14 at 14:24
Stephen ThomasStephen Thomas
10.1k21733
1
True, but I don't have access to the parent sites head part, can't I solve this in the child site?
– DlennartD
Feb 26 '14 at 11:24
1
An iframe cannot modify it's parent (unless the parent is coded to permit it)
– Stephen Thomas
Feb 26 '14 at 11:30
then what's the solution ?
– Muhammad
Sep 7 '15 at 11:31
add a comment |
The problem is that your parent sites don't have the appropriate viewport meta-tag in the <head>. That tag is present in the child site:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
answered Feb 21 '14 at 14:24
Stephen ThomasStephen Thomas
10.1k21733
1
True, but I don't have access to the parent sites head part, can't I solve this in the child site?
– DlennartD
Feb 26 '14 at 11:24
1
An iframe cannot modify it's parent (unless the parent is coded to permit it)
– Stephen Thomas
Feb 26 '14 at 11:30
then what's the solution ?
– Muhammad
Sep 7 '15 at 11:31
add a comment |
The problem is that your parent sites don't have the appropriate viewport meta-tag in the <head>. That tag is present in the child site:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
answered Feb 21 '14 at 14:24
Stephen ThomasStephen Thomas
10.1k21733
The problem is that your parent sites don't have the appropriate viewport meta-tag in the <head>. That tag is present in the child site:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
answered Feb 21 '14 at 14:24
Stephen ThomasStephen Thomas
10.1k21733
answered Feb 21 '14 at 14:24
Stephen ThomasStephen Thomas
10.1k21733
answered Feb 21 '14 at 14:24
Stephen ThomasStephen Thomas
10.1k21733
answered Feb 21 '14 at 14:24
Stephen ThomasStephen Thomas
10.1k21733
10.1k21733
1
True, but I don't have access to the parent sites head part, can't I solve this in the child site?
– DlennartD
Feb 26 '14 at 11:24
1
An iframe cannot modify it's parent (unless the parent is coded to permit it)
– Stephen Thomas
Feb 26 '14 at 11:30
then what's the solution ?
– Muhammad
Sep 7 '15 at 11:31
add a comment |
1
True, but I don't have access to the parent sites head part, can't I solve this in the child site?
– DlennartD
Feb 26 '14 at 11:24
1
An iframe cannot modify it's parent (unless the parent is coded to permit it)
– Stephen Thomas
Feb 26 '14 at 11:30
then what's the solution ?
– Muhammad
Sep 7 '15 at 11:31
1
1
True, but I don't have access to the parent sites head part, can't I solve this in the child site?
– DlennartD
Feb 26 '14 at 11:24
True, but I don't have access to the parent sites head part, can't I solve this in the child site?
– DlennartD
Feb 26 '14 at 11:24
1
1
An iframe cannot modify it's parent (unless the parent is coded to permit it)
– Stephen Thomas
Feb 26 '14 at 11:30
An iframe cannot modify it's parent (unless the parent is coded to permit it)
– Stephen Thomas
Feb 26 '14 at 11:30
then what's the solution ?
– Muhammad
Sep 7 '15 at 11:31
then what's the solution ?
– Muhammad
Sep 7 '15 at 11:31
add a comment |
Create a .php document and upload it to your hosting. Don't create a frame forward in your domain setting, but point the domain to the created .php document. Then use the following code in your .php document to create the frame forward there.
<html>
<head>
<title>Your Title</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-
scale=1.0; user-scalable=0">
<link rel='shortcut icon' type='image/x-icon' href='/favicon.ico' />
</head>
<frameset rows="100%" border="0" framespacing="0" frameborder="0">
<frame name="main" src="https://your-target-domain.com/" marginwidth="0"
marginheight="0" scrolling="auto"
noresize="noresize">
</frameset>
<noframes>
</noframes>
</html>
I created a link to a favicon as well. You can take this line out if you dont need it. If you need it, simply upload your favicon as "favicon.ico" into the same directory as the .php file.
Now you have a mobile responsive frame forwarding :)
answered Nov 14 '18 at 10:55
TimmTimm
1
add a comment |
Create a .php document and upload it to your hosting. Don't create a frame forward in your domain setting, but point the domain to the created .php document. Then use the following code in your .php document to create the frame forward there.
<html>
<head>
<title>Your Title</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-
scale=1.0; user-scalable=0">
<link rel='shortcut icon' type='image/x-icon' href='/favicon.ico' />
</head>
<frameset rows="100%" border="0" framespacing="0" frameborder="0">
<frame name="main" src="https://your-target-domain.com/" marginwidth="0"
marginheight="0" scrolling="auto"
noresize="noresize">
</frameset>
<noframes>
</noframes>
</html>
I created a link to a favicon as well. You can take this line out if you dont need it. If you need it, simply upload your favicon as "favicon.ico" into the same directory as the .php file.
Now you have a mobile responsive frame forwarding :)
answered Nov 14 '18 at 10:55
TimmTimm
1
add a comment |
Create a .php document and upload it to your hosting. Don't create a frame forward in your domain setting, but point the domain to the created .php document. Then use the following code in your .php document to create the frame forward there.
<html>
<head>
<title>Your Title</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-
scale=1.0; user-scalable=0">
<link rel='shortcut icon' type='image/x-icon' href='/favicon.ico' />
</head>
<frameset rows="100%" border="0" framespacing="0" frameborder="0">
<frame name="main" src="https://your-target-domain.com/" marginwidth="0"
marginheight="0" scrolling="auto"
noresize="noresize">
</frameset>
<noframes>
</noframes>
</html>
I created a link to a favicon as well. You can take this line out if you dont need it. If you need it, simply upload your favicon as "favicon.ico" into the same directory as the .php file.
Now you have a mobile responsive frame forwarding :)
answered Nov 14 '18 at 10:55
TimmTimm
1
Create a .php document and upload it to your hosting. Don't create a frame forward in your domain setting, but point the domain to the created .php document. Then use the following code in your .php document to create the frame forward there.
<html>
<head>
<title>Your Title</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-
scale=1.0; user-scalable=0">
<link rel='shortcut icon' type='image/x-icon' href='/favicon.ico' />
</head>
<frameset rows="100%" border="0" framespacing="0" frameborder="0">
<frame name="main" src="https://your-target-domain.com/" marginwidth="0"
marginheight="0" scrolling="auto"
noresize="noresize">
</frameset>
<noframes>
</noframes>
</html>
I created a link to a favicon as well. You can take this line out if you dont need it. If you need it, simply upload your favicon as "favicon.ico" into the same directory as the .php file.
Now you have a mobile responsive frame forwarding :)
answered Nov 14 '18 at 10:55
TimmTimm
1
answered Nov 14 '18 at 10:55
TimmTimm
1
answered Nov 14 '18 at 10:55
TimmTimm
1
answered Nov 14 '18 at 10:55
TimmTimm
1
1
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f21936412%2fresponsive-website-redirected-in-iframe-isnt-responsive%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
iframes are old and bad.. especially in your case.. please do not "redirect" with iframe.. you should use .htaccess or other server settings to do this.
– Hardy
Feb 21 '14 at 13:58
@Hardy You're confusing frames and iframes. Granted, iframes certainly have their issues but sometimes they are the only choice. Frames are pretty much never a good choice.
– patricksweeney
Feb 21 '14 at 14:49