Thousands of experts available around the clock to solve your toughest technology problems.

Dynamically resize Iframe Height of External Blog

I have a website that I want to nest an external Google Blogger Blog in an Iframe on a .cfm container page. Have tried many solutions--no cross domain security warning but iframe just does not resize.

Please: EZ to follow instructions, I am 80% designer, 20% coder....

I do have access to website and html blogger code.

Many, many thanks!

CFM CONTAINER PAGE CODE:
 
<body>
<div id="maincontainer">
 
<div id="topsection">
<cfinclude template="header3_alt.cfm">
</div>
 
<div id="fullwidthcontentwrapper">
<div id="blogcontentcolumn">
		<img src="images/blog-title.jpg" width="1002" height="78" />
<!--<div class="aboutMainText"> -->				
        		 <div class="center"><!-- BLOG -->
        		   <iframe id="idTopFrame" src="http://www.alexchingas.blogspot.com" height="1000" width="1000" scrolling="auto" frameborder="0"></iframe>
        		   <p></p>
		</div>
      <!--</div> -->
</div>
</div>
</div>
 
<div id="footer">
	<cfinclude template="footer.cfm">
</div>
</body>
</html>
 
BLOGGER BLOG CODE:
 
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
  <head>
    <b:include data='blog' name='all-head-content'/>
    <title><data:blog.pageTitle/></title>
    <b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name:     Minima Black
Designer: Douglas Bowman
URL:      www.stopdesign.com
Date:     26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */
 
/* Variable definitions
   ====================
   <Variable name="bgcolor" description="Page Background Color"
             type="color" default="#000" value="#090b1d">
   <Variable name="textcolor" description="Text Color"
             type="color" default="#ccc" value="#cccccc">
   <Variable name="linkcolor" description="Link Color"
             type="color" default="#9ad" value="#99aadd">
   <Variable name="pagetitlecolor" description="Blog Title Color"
             type="color" default="#ccc" value="#cccccc">
   <Variable name="descriptioncolor" description="Blog Description Color"
             type="color" default="#777" value="#777777">
   <Variable name="titlecolor" description="Post Title Color"
             type="color" default="#ad9" value="#aadd99">
   <Variable name="bordercolor" description="Border Color"
             type="color" default="#333" value="#666666">
   <Variable name="sidebarcolor" description="Sidebar Title Color"
             type="color" default="#777" value="#777777">
   <Variable name="sidebartextcolor" description="Sidebar Text Color"
             type="color" default="#999" value="#999999">
   <Variable name="visitedlinkcolor" description="Visited Link Color"
             type="color" default="#a7a" value="#aa77aa">
   <Variable name="bodyfont" description="Text Font"
             type="font" default="normal normal 100% 'Trebuchet MS',Trebuchet,Verdana,Sans-serif" value="normal normal 100% Trebuchet, Trebuchet MS, Arial, sans-serif">
   <Variable name="headerfont" description="Sidebar Title Font"
             type="font"
             default="normal bold 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif" value="normal bold 78% Trebuchet, Trebuchet MS, Arial, sans-serif">
   <Variable name="pagetitlefont" description="Blog Title Font"
             type="font"
             default="normal bold 200% 'Trebuchet MS',Trebuchet,Verdana,Sans-serif" value="normal normal 290% Arial, sans-serif">
   <Variable name="descriptionfont" description="Blog Description Font"
             type="font"
             default="normal normal 78% 'Trebuchet MS', Trebuchet, Verdana, Sans-serif" value="normal bold 86% 'Trebuchet MS', Trebuchet, Verdana, Sans-serif">
   <Variable name="postfooterfont" description="Post Footer Font"
             type="font"
             default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif">
   <Variable name="startSide" description="Start side in blog language"
             type="automatic" default="left" value="left">
   <Variable name="endSide" description="End side in blog language"
             type="automatic" default="right" value="right">
*/
 
/* Use this with templates/template-twocol.html */
 
/* HIDE NAV BAR */
#navbar {      
  height: 0px;      
  visibility: hidden;      
  display: none;}
/* END HIDE NAV BAR */
 
body {
  background:$bgcolor;
  margin:0;
  color:$textcolor;
  font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;
  font-size/* */:/**/small;
  font-size: /**/small;
  text-align: center;
  }
a:link {
  color:$linkcolor;
  text-decoration:none;
  }
a:visited {
  color:$visitedlinkcolor;
  text-decoration:none;
  }
a:hover {
  color:$titlecolor;
  text-decoration:underline;
}
a img {
  border-width:0;
  }
 
/* Header
-----------------------------------------------
 */
 
#header-wrapper {
  width:660px;
  margin:0 auto 10px;
  border:1px solid $bordercolor;
  }
 
#header-inner {
  background-position: center;
  margin-$startSide: auto;
  margin-$endSide: auto;
}
 
#header { 
  margin: 5px;
  border: 1px solid $bordercolor;
  text-align: left;
  color:$pagetitlecolor;
}
 
#header h1 {
  margin:5px 5px 0 300px;
  padding:15px 20px .25em;
  line-height:1.2em;
  text-transform:uppercase;
  letter-spacing:-.2em;
  font: $pagetitlefont;
}
 
#header a {
  color:$pagetitlecolor;
  text-decoration:none;
  }
 
#header a:hover {
  color:$pagetitlecolor;
  }
 
#header .description {
  margin:0 5px 5px 300px;
  padding:0 20px 15px;
  max-width:700px;
  text-transform:uppercase;
  letter-spacing:.2em;
  line-height: 1.4em;
  font: $descriptionfont;
  color: $descriptioncolor;
}
 
#header img {
  /*margin-$startSide: auto;*/
  /*margin-$endSide: auto;*/
}
 
 
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
  width: 660px;
  margin:0 auto;
  padding:10px;
  text-align:$startSide;
  font: $bodyfont;
  }
 
#main-wrapper {
  width: 410px;
  float: $startSide;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
  }
 
#sidebar-wrapper {
  width: 220px;
  float: $endSide;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
}
 
 
/* Headings
----------------------------------------------- */
 
h2 {
  margin:1.5em 0 .75em;
  font:$headerfont;
  line-height: 1.4em;
  text-transform:uppercase;
  letter-spacing:.2em;
  color:$sidebarcolor;
}
 
 
/* Posts
-----------------------------------------------
 */
h2.date-header {
  margin:1.5em 0 .5em;
  }
 
.post {
  margin:.5em 0 1.5em;
  border-bottom:1px dotted $bordercolor;
  padding-bottom:1.5em;
  }
.post h3 {
  margin:.25em 0 0;
  padding:0 0 4px;
  font-size:140%;
  font-weight:normal;
  line-height:1.4em;
  color:$titlecolor;
}
 
.post h3 a, .post h3 a:visited, .post h3 strong {
  display:block;
  text-decoration:none;
  color:$titlecolor;
  font-weight:bold;
}
 
.post h3 strong, .post h3 a:hover {
  color:$textcolor;
}
 
.post-body {
  margin:0 0 .75em;
  line-height:1.6em;
}
 
.post-body blockquote {
  line-height:1.3em;  
}
 
.post-footer {
  margin: .75em 0;
  color:$sidebarcolor;
  text-transform:uppercase;
  letter-spacing:.1em;
  font: $postfooterfont;
  line-height: 1.4em;
}
 
.comment-link {
  margin-$startSide:.6em;
  }
.post img {
  padding:4px;
  border:1px solid $bordercolor;
  }
.post blockquote {
  margin:1em 20px;
  }
.post blockquote p {
  margin:.75em 0;
  }
 
/* Comments
----------------------------------------------- */
#comments h4 {
  margin:1em 0;
  font-weight: bold;
  line-height: 1.4em;
  text-transform:uppercase;
  letter-spacing:.2em;
  color: $sidebarcolor;
  }
 
#comments-block {
  margin:1em 0 1.5em;
  line-height:1.6em;
  }
#comments-block .comment-author {
  margin:.5em 0;
  }
#comments-block .comment-body {
  margin:.25em 0 0;
  }
#comments-block .comment-footer {
  margin:-.25em 0 2em;
  line-height: 1.4em;
  text-transform:uppercase;
  letter-spacing:.1em;
  }
#comments-block .comment-body p {
  margin:0 0 .75em;
  }
.deleted-comment {
  font-style:italic;
  color:gray;
  }
 
.feed-links {
  clear: both;
  line-height: 2.5em;
}
 
#blog-pager-newer-link {
  float: $startSide;
 }
 
#blog-pager-older-link {
  float: $endSide;
 }
 
#blog-pager {   
  text-align: center; 
 }
 
/* Sidebar Content
----------------------------------------------- */
.sidebar { 
  color: $sidebartextcolor;
  line-height: 1.5em;
 }
 
.sidebar ul {
  list-style:none;
  margin:0 0 0;
  padding:0 0 0;
}
.sidebar li {
  margin:0;
  padding-top:0;
  padding-$endSide:0;
  padding-bottom:.25em;
  padding-$startSide:15px;
  text-indent:-15px;
  line-height:1.5em;
  }
 
.sidebar .widget, .main .widget { 
  border-bottom:1px dotted $bordercolor;
  margin:0 0 1.5em;
  padding:0 0 1.5em;
 }
 
.main .Blog { 
  border-bottom-width: 0;
}
 
/* Profile 
----------------------------------------------- */
.profile-img { 
  float: $startSide;
  margin-top: 0;
  margin-$endSide: 5px;
  margin-bottom: 5px;
  margin-$startSide: 0;
  padding: 4px;
  border: 1px solid $bordercolor;
}
 
.profile-data {
  margin:0;
  text-transform:uppercase;
  letter-spacing:.1em;
  font: $postfooterfont;
  color: $sidebarcolor;
  font-weight: bold;
  line-height: 1.6em;
}
 
.profile-datablock { 
  margin:.5em 0 .5em;
}
 
.profile-textblock { 
  margin: 0.5em 0;
  line-height: 1.6em;
}
 
.profile-link { 
  font: $postfooterfont;
  text-transform: uppercase;
  letter-spacing: .1em;
}
 
/* Footer
----------------------------------------------- */
#footer {
  width:660px;
  clear:both;
  margin:0 auto;
  padding-top:15px;
  line-height: 1.6em;
  text-transform:uppercase;
  letter-spacing:.1em;
  text-align: center;
}
]]></b:skin>
  </head>
 
  <body>
  <div id='outer-wrapper'><div id='wrap2'>
 
    <!-- skip links for text browsers -->
    <span id='skiplinks' style='display:none;'>
      <a href='#main'>skip to main </a> |
      <a href='#sidebar'>skip to sidebar</a>
    </span>
 
    <div id='header-wrapper'>
      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Alex Says... (Header)' type='Header'/>
</b:section>
    </div>
 
    <div id='content-wrapper'>
 
      <div id='crosscol-wrapper' style='text-align:center'>
        <b:section class='crosscol' id='crosscol' showaddelement='no'/>
      </div>
 
      <div id='main-wrapper'>
        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
      </div>
 
      <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Followers2' locked='false' title='Followers' type='Followers'/>
<b:widget id='BlogArchive2' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='Profile2' locked='false' title='About Me' type='Profile'/>
</b:section>
      </div>
 
      <!-- spacer for skins that want sidebar and main to be the same height-->
      <div class='clear'>&#160;</div>
 
    </div> <!-- end content-wrapper -->
 
    <div id='footer-wrapper'>
      <b:section class='footer' id='footer'/>
    </div>
 
  </div></div> <!-- end outer-wrapper -->
</body>
</html>
                                
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
137:
138:
139:
140:
141:
142:
143:
144:
145:
146:
147:
148:
149:
150:
151:
152:
153:
154:
155:
156:
157:
158:
159:
160:
161:
162:
163:
164:
165:
166:
167:
168:
169:
170:
171:
172:
173:
174:
175:
176:
177:
178:
179:
180:
181:
182:
183:
184:
185:
186:
187:
188:
189:
190:
191:
192:
193:
194:
195:
196:
197:
198:
199:
200:
201:
202:
203:
204:
205:
206:
207:
208:
209:
210:
211:
212:
213:
214:
215:
216:
217:
218:
219:
220:
221:
222:
223:
224:
225:
226:
227:
228:
229:
230:
231:
232:
233:
234:
235:
236:
237:
238:
239:
240:
241:
242:
243:
244:
245:
246:
247:
248:
249:
250:
251:
252:
253:
254:
255:
256:
257:
258:
259:
260:
261:
262:
263:
264:
265:
266:
267:
268:
269:
270:
271:
272:
273:
274:
275:
276:
277:
278:
279:
280:
281:
282:
283:
284:
285:
286:
287:
288:
289:
290:
291:
292:
293:
294:
295:
296:
297:
298:
299:
300:
301:
302:
303:
304:
305:
306:
307:
308:
309:
310:
311:
312:
313:
314:
315:
316:
317:
318:
319:
320:
321:
322:
323:
324:
325:
326:
327:
328:
329:
330:
331:
332:
333:
334:
335:
336:
337:
338:
339:
340:
341:
342:
343:
344:
345:
346:
347:
348:
349:
350:
351:
352:
353:
354:
355:
356:
357:
358:
359:
360:
361:
362:
363:
364:
365:
366:
367:
368:
369:
370:
371:
372:
373:
374:
375:
376:
377:
378:
379:
380:
381:
382:
383:
384:
385:
386:
387:
388:
389:
390:
391:
392:
393:
394:
395:
396:
397:
398:
399:
400:
401:
402:
403:
404:
405:
406:
407:
408:
409:
410:
411:
412:
413:
414:
415:
416:
417:
418:
419:
420:
421:
422:
423:
424:
425:
426:
427:
428:
429:
430:
431:
432:
433:
434:
435:
436:
437:
438:
439:
440:
441:
442:
443:
444:
445:
446:
447:
448:
449:
450:
451:
452:
453:
454:
455:
456:
457:
458:
459:
460:
461:
462:
463:
464:
465:

Select allOpen in new window

201407-LO-Qu-006

Unlock thousands of answers and tutorials instantly!

Try it Free

30 day free trial. Cancel anytime.

Learn More about HOW IT WORKS

Get Experts Exchange's

Career Builder Guide

Become successful in your tech career.

We will never share this with anyone.

Experts Exchange powers the growth and success
of technology professionals worldwide.

  • Solve

    Experts Exchange is the tech professional’s trusted, on-demand resource for solving difficult problems, making informed decisions, and delivering excellent solutions.

  • Learn

    With unparalleled access to technical experts, verified real-world solutions, and diverse educational content, Experts Exchange enables personalized development of technology skills.

  • Network

    Experts Exchange gives you the professional exposure and valued relationships key to building the career you want.

Join the Network Today

See Plans and Pricing