Side by side IFRAMES

**edolison** · 05-26-2011 07:50 AM

Is there a way to create side-by-side or horizontal IFRAMES. If so please provide an example. Thanks

**DanInMA** · 05-26-2011 09:35 AM

side by side

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
<!--
iframe {
float:left;
margin:20px;
}
-->
</style>
</head>
<iframe width="350" height="700" src="http://www.google.com" frameborder="0"></iframe>
<iframe width="350" height="700" src="http://www.yahoo.com" frameborder="0"></iframe>

<body>
</body>
</html>

**edolison** · 05-26-2011 10:59 AM

Great. Thanks so much!!

**DanInMA** · 05-26-2011 11:02 AM

woops! slight correction,

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
<!--
iframe {
float:left;
margin:20px;
}
-->
</style>
</head>

<body>
<iframe width="350" height="700" src="http://www.google.com" frameborder="0"></iframe>
<iframe width="350" height="700" src="http://www.yahoo.com" frameborder="0"></iframe>

</body>
</html>

**FalconWebMaster** · 05-27-2011 12:40 PM

I'm working at the same objective here. I have two iframes, side by side, inside a div. The div has a border of 1px. When I use {float: left;} on the left iframe, it covers the div's left border. But when I use {float: right;} on the right iframe, it does NOT cover the div's right border.

To get the page to appear how I want, I only use the {float: right;}, but from what I know and have experiences with iframes and html, this shouldn't work this way. Can someone explain this to me?

And the reason I'm using the div tag is that I want my content centered on the page, and while "body {text-align: center;}" makes things look fine in IE, it does not in Firefox 4. If there are any ideas why this is so, please add to reply.

Thanks

**DanInMA** · 05-27-2011 12:43 PM

Originally Posted by FalconWebMaster

I'm working at the same objective here. I have two iframes, side by side, inside a div. The div has a border of 1px. When I use {float: left;} on the left iframe, it covers the div's left border. But when I use {float: right;} on the right iframe, it does NOT cover the div's right border.

To get the page to appear how I want, I only use the {float: right;}, but from what I know and have experiences with iframes and html, this shouldn't work this way. Can someone explain this to me?

And the reason I'm using the div tag is that I want my content centered on the page, and while "body {text-align: center;}" makes things look fine in IE, it does not in Firefox 4. If there are any ideas why this is so, please add to reply.

Thanks

sounds like a default css setting issue. post yer code in a new thread and we can take a look at it

**FalconWebMaster** · 05-27-2011 12:58 PM

Done. See thread "Please explain..."

**FalconWebMaster** · 06-06-2011 03:44 PM

I figured this out. Chrome reads carriage returns as white space, and thus, I needed to scale down my iframe so the whitespace plus the iframe would fit in the alotted space.

Thread: Side by side IFRAMES

Thread Tools

Display

Side by side IFRAMES

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions