Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > FireFox/NS experts: <iframe> inside <div> question -- help pls!

Reply
Thread Tools

FireFox/NS experts: <iframe> inside <div> question -- help pls!

 
 
Julia Briggs
Guest
Posts: n/a
 
      11-12-2004
How do I construct a <iframe> or equivalent for FireFox/NS browsers,
inside a screen centered <div> tag? Can it be done?
 
Reply With Quote
 
 
 
 
mscir
Guest
Posts: n/a
 
      11-12-2004
Julia Briggs wrote:

> How do I construct a <iframe> or equivalent for FireFox/NS browsers,
> inside a screen centered <div> tag? Can it be done?


Does this work for you?

<style type="text/css">
..inline {
background-color: #FFAABB;
text-align: center;
height: 520px;
width: 520px;
}
..if1{
width: 500px;
height: 500px;
}
</style>


<div class="inline">
<iframe class="if1" SRC="http://www.google.com">
</iframe>
</div>
 
Reply With Quote
 
 
 
 
RobB
Guest
Posts: n/a
 
      11-13-2004
mscir <(E-Mail Removed)> wrote in message news:<(E-Mail Removed)>...
> Julia Briggs wrote:
>
> > How do I construct a <iframe> or equivalent for FireFox/NS browsers,
> > inside a screen centered <div> tag? Can it be done?

>
> Does this work for you?
>
> <style type="text/css">
> .inline {
> background-color: #FFAABB;
> text-align: center;
> height: 520px;
> width: 520px;
> }
> .if1{
> width: 500px;
> height: 500px;
> }
> </style>
>
>
> <div class="inline">
> <iframe class="if1" SRC="http://www.google.com">
> </iframe>
> </div>


Since this is a JS group, I assume you meant programmatically...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>foo</title>
<style type="text/css">

html, body {
width: 100%;
height: 100%;
}
#container {
width: 70%;
height: 70%;
margin: 40px auto;
background: pink;
}

</style>
<script type="text/javascript">
//<![CDATA[

function IFramePopulate(ctr_id, src)
{
var ctr;
if (ctr = document.getElementById(ctr_id))
{
while (ctr.hasChildNodes())
ctr.removeNode(ctr.lastChild);
var ifrm = document.createElement('IFRAME');
//ifrm.frameBorder = 0; //optional
ifrm.style.width = String(ctr.offsetWidth + 'px');
ifrm.style.height = String(ctr.offsetHeight + 'px');
ctr.appendChild(ifrm);
ifrm.src = src;
}
}

//]]>
</script>
</head>
<body>
<div id="container"></div>
<div style="text-align:center;"><a href="#null"
onclick="IFramePopulate('container',
'http://www.google.com')">go</a></div>
</body>
</html>
 
Reply With Quote
 
Randy Webb
Guest
Posts: n/a
 
      11-13-2004
RobB wrote:
> mscir <(E-Mail Removed)> wrote in message news:<(E-Mail Removed)>...
>
>>Julia Briggs wrote:
>>
>>
>>>How do I construct a <iframe> or equivalent for FireFox/NS browsers,
>>>inside a screen centered <div> tag? Can it be done?

>>
>>Does this work for you?
>>
>><style type="text/css">
>>.inline {
>> background-color: #FFAABB;
>> text-align: center;
>> height: 520px;
>> width: 520px;
>>}
>>.if1{
>> width: 500px;
>> height: 500px;
>>}
>></style>
>>
>>
>><div class="inline">
>><iframe class="if1" SRC="http://www.google.com">
>></iframe>
>></div>

>
>
> Since this is a JS group, I assume you meant programmatically...


Why rely on a JS dependency when its not needed?

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq
Answer:It destroys the order of the conversation
Question: Why?
Answer: Top-Posting.
Question: Whats the most annoying thing on Usenet?
 
Reply With Quote
 
Julia Briggs
Guest
Posts: n/a
 
      11-13-2004
Ok, how can I get that to auto-center as an absolute layer? I've tried
different ways, but can only get it to display in a fixed position.

Julia
 
Reply With Quote
 
mscir
Guest
Posts: n/a
 
      11-13-2004
Julia Briggs wrote:

> Ok, how can I get that to auto-center as an absolute layer? I've tried
> different ways, but can only get it to display in a fixed position.


If you mean how can you center the div on the page using CSS, while this
might not be the best newsgroup for a CSS inquiry, did you try:

margin: auto;

maybe something like:

..div1{
width: 420px;
height: 420px;
margin: auto; /* center div on page */
text-align: center; /* center iframe in div */
}

<div class='div1'>
<iframe>
</iframe>
</div>
 
Reply With Quote
 
Toby Inkster
Guest
Posts: n/a
 
      11-13-2004
Julia Briggs wrote:

> Ok, how can I get that to auto-center as an absolute layer?


div.layer {
position: absolute;
left: 50%;
width: 200px;
margin-left: -100px;
}

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

 
Reply With Quote
 
RobB
Guest
Posts: n/a
 
      11-15-2004
Toby Inkster <(E-Mail Removed)> wrote in message news:<(E-Mail Removed) o.uk>...
> Julia Briggs wrote:
>
> > Ok, how can I get that to auto-center as an absolute layer?

>
> div.layer {
> position: absolute;
> left: 50%;
> width: 200px;
> margin-left: -100px;
> }


> Randy Webb wrote:
>
> Why rely on a JS dependency when its not needed?


Thought I covered that: "Since this is a JS group, I assume you meant
programmatically..."

Took the meaning of "construct" as signifying "after load" as
otherwise it's simply an HTML-related query. Could be incorrect,
although this:

> Ok, how can I get that to auto-center...


....didn't help elucidate the issue. fwiw...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>foo</title>
<style type="text/css">

html, body {
width: 100%;
height: 100%;
}
#container {
position: relative;
width: 600px;
height: 400px;
margin: 40px auto;
border: 3px #000 double;
background: pink;
}

</style>
<script type="text/javascript">
//<![CDATA[

function IFramePopulate(ctr_id, src)
{
var ctr;
if (ctr = document.getElementById(ctr_id))
{
while (ctr.hasChildNodes())
ctr.removeNode(ctr.lastChild);
var ifrm = document.createElement('IFRAME');
ctr.appendChild(ifrm);
ifrm.frameBorder = 0; //optional
ifrm.style.width = '450px';
ifrm.style.height = '300px';
ifrm.style.position = 'absolute';
ifrm.style.left = String((ctr.offsetWidth - ifrm.offsetWidth) * .5)
+ 'px';
ifrm.style.top = String((ctr.offsetHeight - ifrm.offsetHeight) * .5)
+ 'px';
ifrm.src = src;
}
}

//]]>
</script>
</head>
<body>
<div id="container"></div>
<div style="text-align:center;"><a href="#null"
onclick="IFramePopulate('container',
'http://www.google.com')">go</a></div>
</body>
</html>

Yes. I know, it's JS....
 
Reply With Quote
 
Randy Webb
Guest
Posts: n/a
 
      11-15-2004
RobB wrote:
> Toby Inkster <(E-Mail Removed)> wrote in message news:<(E-Mail Removed) o.uk>...
>
>>Julia Briggs wrote:
>>
>>
>>>Ok, how can I get that to auto-center as an absolute layer?

>>
>>div.layer {
>> position: absolute;
>> left: 50%;
>> width: 200px;
>> margin-left: -100px;
>>}

>
>
>>Randy Webb wrote:
>>
>>Why rely on a JS dependency when its not needed?

>
>
> Thought I covered that: "Since this is a JS group, I assume you meant
> programmatically..."


Does that mean if they ask how to set the color of an element, in a JS
group, then you will give them a JS solution instead of an HTML/CSS
solution?

Just because a question is asked in a particular group does not mean
that the answer is necessarily the topic of that group.

But this message is not posted solely to c.l.j, it is also posted to
alt.html

Again, why rely on a JS dependency when its not needed?

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq
 
Reply With Quote
 
RobB
Guest
Posts: n/a
 
      11-15-2004
Randy Webb <(E-Mail Removed)> wrote in message news:<(E-Mail Removed)>...
> RobB wrote:
> > Toby Inkster <(E-Mail Removed)> wrote in message news:<(E-Mail Removed) o.uk>...
> >
> >>Julia Briggs wrote:
> >>
> >>
> >>>Ok, how can I get that to auto-center as an absolute layer?
> >>
> >>div.layer {
> >> position: absolute;
> >> left: 50%;
> >> width: 200px;
> >> margin-left: -100px;
> >>}

> >
> >
> >>Randy Webb wrote:
> >>
> >>Why rely on a JS dependency when its not needed?

> >
> >
> > Thought I covered that: "Since this is a JS group, I assume you meant
> > programmatically..."

>
> Does that mean if they ask how to set the color of an element, in a JS
> group, then you will give them a JS solution instead of an HTML/CSS
> solution?
>
> Just because a question is asked in a particular group does not mean
> that the answer is necessarily the topic of that group.
>
> But this message is not posted solely to c.l.j, it is also posted to
> alt.html
>
> Again, why rely on a JS dependency when its not needed?


This is silly. Here's the original Q:

> How do I construct a <iframe> or equivalent for FireFox/NS browsers,
> inside a screen centered <div> tag? Can it be done?


When I read that, it seemed unlikely that anyone would be asking if
they could 'construct' an iframe (HTML) inside a div (HTML) - that's
like posting "can I put a image inside a paragraph?" Not impossible,
but unlikely. I interpreted it as a request for a dynamic solution.
But, you're right, I am deeply ashamed, and I'll never post here again
after this unforgiveable lapse.

> Does that mean if they ask how to set the color of an element, in a JS
> group, then you will give them a JS solution instead of an HTML/CSS
> solution?


Maybe.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
help with pix inside->outside + dmz->outside + inside->outside->dmz Jack Cisco 0 09-19-2007 01:57 AM
Configuring an inside nat group on inside interface jaalcock@gmail.com Cisco 2 04-11-2006 02:16 AM
inside-outside-inside issue on PIX 506E Dan Rice Cisco 9 02-04-2005 12:04 AM
Problem with inside to inside traffic after upgrading PIX 515 Cisco 5 06-15-2004 06:34 AM
Dynamic temp. datagrid col.gen. -Session access inside a class inside a UserCtrl Andy Eshtry ASP .Net 0 03-01-2004 11:48 PM



Advertisments