Moving iFrames

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Reply

Join Date: Jan 2007
Posts: 4
Reputation: motox16 is an unknown quantity at this point 
Solved Threads: 0
motox16's Avatar
motox16 motox16 is offline Offline
Newbie Poster

Moving iFrames

 
0
  #1
Feb 4th, 2007
Hey all, I need with my iframes that I put on my webpage.

As you can see by the image here, they are not centered properly:

Using the center alignment just doesn't move it enough to the spot I want it. I was wondering if maybe there were some other way to move it. Any help would be appreciated.

Here's my code:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <%@LANGUAGE="JAVASCRIPT" CODEPAGE="1252"%>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. <!-- TemplateBeginEditable name="doctitle" -->
  7. <title>Untitled Document</title>
  8. <!-- TemplateEndEditable -->
  9. <!-- TemplateBeginEditable name="head" -->
  10. <!-- TemplateEndEditable -->
  11. <style type="text/css">
  12. <!--
  13. body {
  14. background-image: url(../background.gif);
  15. }
  16. .style1 {color: #FFFFFF}
  17. .style2 {color: #000000; }
  18. -->
  19. </style>
  20. </head>
  21.  
  22. <body>
  23. <div style="text-align:center;">
  24. <p><img src="../toppartpsd copy copy.png" width="800" height="240" border="0" /></p>
  25. <p>&nbsp;</p>
  26. </div>
  27. <table width="100%" height="600" border="1" align="center" cellpadding="5" cellspacing="1">
  28. <tr>
  29. <td width="200" height="220" align="right" valign="middle" background="../litle box.png" bgcolor="#2C2C2C" scope="col"> &nbsp;
  30. <iframe src="http://www.teamufh.com/phsycostats"
  31. width="120" height="180" marginwidth="0" marginheight="0"
  32. hspace="0" vspace="0" frameborder="0" scrolling=yes> </iframe></td>
  33. <td width="343" rowspan="2" align="right" valign="bottom" bordercolor="#2B2B2B" background="../main-box.png" scope="col"><p>&nbsp;
  34. <iframe src="http://www.teamufh.com/main"
  35. width="300" height="420" marginwidth="0" marginheight="0"
  36. hspace="0" vspace="0" frameborder="0" scrolling=yes> </iframe>
  37. </p>
  38. <p>&nbsp;</p>
  39. <p>&nbsp;</p></td>
  40. <td width="250" height="280" align="center" valign="middle" background="../litle box.png" bgcolor="#2C2C2C" scope="col">&nbsp;
  41. <iframe src="http://www.teamufh.com/phsycostats"
  42. width="120" height="180" marginwidth="0" marginheight="0"
  43. hspace="0" vspace="0" frameborder="0" scrolling=yes> </iframe></td>
  44. </tr>
  45. <tr>
  46. <td width="250" height="280" align="center" valign="middle" bordercolor="#F4F4F4" background="../litle box.png" bgcolor="#2D2D2D" scope="col">&nbsp;
  47. <iframe src="http://www.teamufh.com/phsycostats"
  48. width="120" height="180" marginwidth="0" marginheight="0"
  49. hspace="0" vspace="0" frameborder="0" scrolling=yes> </iframe></td>
  50. <td width="250" height="280" align="center" valign="middle" background="../litle box.png" bgcolor="#2B2B2B" scope="col">&nbsp;
  51. <iframe src="http://www.teamufh.com/phsycostats"
  52. width="120" height="180" marginwidth="0" marginheight="0"
  53. hspace="0" vspace="0" frameborder="0" scrolling=yes> </iframe></td>
  54. </tr>
  55. </table>
  56. </body>
  57. </html>

Thanks in advance :mrgreen:
Reply With Quote Quick reply to this message  
Join Date: Jan 2007
Posts: 3,210
Reputation: MidiMagic has a spectacular aura about MidiMagic has a spectacular aura about 
Solved Threads: 165
MidiMagic's Avatar
MidiMagic MidiMagic is offline Offline
Nearly a Senior Poster

Re: Moving iFrames

 
0
  #2
Feb 9th, 2007
It has been my experience that, since different browsers render objects differently, that it is impossible to do what you are trying to do and have it render correctly on all browsers. The usual causes of the problem are:

- Some browsers include the borders, margins, and padding in the width you declare of a block object. Others do not include these, so the object gets wider when you add borders, margins, or padding.

- When this extra width is added in, it can make the entire page wider than 100 percent. Then the browser has to cheat to fit everything in. It steals the room where it can find it. This results in uneven locations, squeezed columns, moved images, and columns stacked vertically.

- If you write the page for the browser that takes more space for the extras, then the page has slop in it when rendered on browsers which don't take more space for the extras. So everything slides to the left.

- On the browsers that don't take more space outside the block, the space is taken inside the block. This squeezes the stuff in the block.

- With the browsers that take the extra space outside the block, code written for browsers that take the space inside the block now has slop inside the block.

The moral is: You can't win. Your page is sloppy on some browser, no matter how you write your code.

Since IE is the one not following the standard, I let the page look sloppy on IE, and say why.
Last edited by MidiMagic; Feb 9th, 2007 at 2:49 pm.
Daylight-saving time uses more gasoline
Reply With Quote Quick reply to this message  
Join Date: Jan 2007
Posts: 4
Reputation: motox16 is an unknown quantity at this point 
Solved Threads: 0
motox16's Avatar
motox16 motox16 is offline Offline
Newbie Poster

Re: Moving iFrames

 
0
  #3
Feb 9th, 2007
Thank you for the pointers, its too bad that I can't get them to do exactly what i want them to do. I did manage to get them fairly centered although some of them are a little off still but it is the best that I can do. I wish there were a better way to do this :-| but o well, it doesn't have to be THAT perfect anyway.

I'll post the link to the website once i get the content on it finished
Reply With Quote Quick reply to this message  
Reply

This thread is more than three months old.
Perhaps start a new thread instead?
Message:



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum
Thread Tools Search this Thread



Tag cloud for JavaScript / DHTML / AJAX
About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC