Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Rendering <object> elements

Posted on 2006-11-21
3
236 Views
Last Modified: 2010-04-09
I have a webpage with several <object> elements -- references to other .htm web pages that I want to embed in my primary page. However, when they render on my browser, they always render at the same size -- it looks like 200x200. I could adjust their size by adding height and width attributes, but what I really want is for the browser to render these objects to a reasonable size given the size of the browser window. I thought I could do something like this:

<div style="border: 1px solid black;">
     <object data="mydata.htm" id="myobj">
</div>

Here, the <div> element expands to a good size, but rather than occupying the entire box enclosed by the <div> element, the <object> is still the same 200x200. Is there any way to get the browser to dynamically choose an appropriate size for the <object> element -- particularly, is there any way to do it without Javascript? (I already have Javascript code that does what I want to do, but I'm having cross-browser compatibitility problems, especially with Opera and the Mac browsers.)

Thanks,

Jay
0
Comment
Question by:tjgquicken
3 Comments
 
LVL 12

Expert Comment

by:jessegivy
ID: 17993916
What size do you want the objects to be?
0
 
LVL 13

Accepted Solution

by:
jmundsack earned 200 total points
ID: 17994907
You could use an IFRAME with its width and height both set to 100%, then place it inside a DIV and configure the widths and heights of all the DIVs on your page as you like (perhaps with widths and heights relative to page dimensions?).

<div style="border: 1px solid black; width: 500px; height: 400px;">
<iframe src="http://www.experts-exchange.com/" id="myobj" style="width: 100%; height: 100%;">
</div>

Or...

<div style="border: 1px solid black; width: 80%; height: 50%;">
<iframe src="http://www.experts-exchange.com/" id="myobj" style="width: 100%; height: 100%;">
</div>

It's not really clear what you mean by "get the browser to dynamically choose an appropriate size"--if you mean you want it to interpret the overall dimensions of the HTML contained in the embedded page, then I think there's no way to escape Javascript.

0
 

Author Comment

by:tjgquicken
ID: 18009273
Silly me... <object id="myobj" src="mysrc.htm" width="100%" height="100%">
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…

861 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question