Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations biv343 on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

"seamless" Iframe or regular frames 1

Status
Not open for further replies.
endoflux

endoflux

Technical User
Aug 6, 2001
227
US
All I'm trying to load different content in the bottom half of my page based on a menu click in the top half of my page...but I want them to appear as 1 seamless page, and the background images need to line up perfectly. All options I've tried for frames have left me with a noticeable space between frames or an 'indented' box where the iframe is-- any idea how I can accomplish this?

Thanks!
 
Sort by date Sort by votes
This is pretty seamless.
Code: 
<html>
<head>

<style type="text/css">
<!--
iframe  {
	border: 0px;
	margin: 0px;
	padding:  0px;
}

#frame1 {
	display:block;
	width:  100%;
}

#frame2 {
	display:block;
	width:  100%;
}
-->
</style>

</head>
<body>
<iframe id="frame1" src="[URL unfurl="true"]http://google.com"></iframe>[/URL]
<iframe id="frame2" src="[URL unfurl="true"]http://google.com"></iframe>[/URL]
</body>
</html>

M. Brooks
 
Upvote 0 Downvote
That's a damned good start...but i still have a line between the two frames. The link below works in Firefox, but not in IE; I'll have to figure out why later...but if you can get it to show up, note the backgound-colored line-- ideas?


...and the code I stole and modified:

<html>
<head>
<style type="text/css">
<!--
iframe {
border: 0px;
margin: 0px;
padding: 0px;
}
#frame1 {
display:block;
width: 1024;
height: 212;
}
#frame2 {
display:block;
width: 1024;
height: 556
}
-->
</style>
</head>
<body bgcolor=5C5D60>
<center>
<iframe id="frame1" src="top.html" scrolling="no" marginwidth="0" marginheight="0"></iframe>
<iframe id="frame2" src="fhome.html" scrolling="no" marginwidth="0" marginheight="0"></iframe>
</center>
</body>
</html>
 
Upvote 0 Downvote
Here you go!
Code: 
<html>
<head>

<style type="text/css">
<!--
iframe  {
    border: 0px;
    margin: 0px;
    padding:  0px;
}

#frame1 {
    display:block;
    width:  100%;
}

#frame2 {
    display:block;
    width:  100%;
}
-->
</style>

</head>
<body bgcolor="#5C5D60">
<iframe id="frame1" src="[URL unfurl="true"]http://google.com"[/URL] frameborder="0" marginheight="0"></iframe>
<iframe id="frame2" src="[URL unfurl="true"]http://google.com"[/URL] frameborder="0" marginheight="0"></iframe>
</body>
</html>

M. Brooks
 
Upvote 0 Downvote
I'm confused...how is that different from what I had? For whatever reason, even when I copy your code directly and just change the page references to my html files, I still get that space

I really do appreciate your help, by the way...
 
Upvote 0 Downvote
This is the major difference. And in IE or Firefox I don't see the bar.
Code: 
<iframe id="frame2" src="[URL unfurl="true"]http://google.com"[/URL] [b]frameborder="0"[/b] marginheight="0"></iframe>

M. Brooks
 
Upvote 0 Downvote
Got it!

My mistake-- I had placed each of my src background images in tables to explicitely control their size and location...by haveing a </table> and then a <table>, they couldn't be 'seamless'. Worked like a charm after that...thanks again!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

SitesMasstec
  • Locked
  • Question
Viewport meta tag x iframe
Replies
0
Views
165
SitesMasstec
SitesMasstec
pendle666
  • Locked
  • Question
Inserting same line of text of every web page - &quot;link&quot; insert? 1
Replies
6
Views
279
ChrisHirst
ChrisHirst
caykamanj1966
  • Locked
  • Question
Sorting a grid list using iframe associated with Google Drive
Replies
0
Views
242
caykamanj1966
caykamanj1966
lupidol
  • Locked
  • Question
input:hover[type=&quot;submit&quot;] 1
Replies
4
Views
394
lupidol
lupidol
kjv1611
  • Locked
  • Question
How Can I Know This Site Doesn't &quot;Phone Home&quot;? 2
Replies
9
Views
215
spamjim
spamjim

Part and Inventory Search

Sponsor

Back
Top