HTML - Help! My Iframes Are Driving Me Bonkers!

Hey everyone, my website is pretty much viewing the same on my mac and on my pc now, except one big problem.

Photoshop uses an automatic table generator which I used to layout my pop-up windows. I replaced one of the images into the background, and placed my text over it. This all works fine.

My problem is that for some reason, IE is putting a 15px gap on my table in the worst places.

http://www.myportfolio.ws/products/logo.html

It works fine on my Firefox/Safari.

Please help me ><;;;

Also, why everytime I validate my html/xhtml I get a million errors when I know for a fact that its not ? My whole website is gaggle-full of errors that confuse me.

Please help me out, I am entirely self-taught and this is just killing me.

my website www.palmettogoldandsilver.com looks fine on safari, and firefox.. but on internet explorer my links are not centered, and my background image for my body div tag is not showing up.

I am hoping someone with "fresh" eyes will be able to spot why I have a 1 pixel space pushing the bottom of my table down. It's a project I inherited, so it's not my code, but it should be obvious to me as to why it's not formatting correctly (but for the life of me, I cant see it). Anyone?

Top part of code (if it's of any use):
Code:

<table border="0" cellpadding="0" cellspacing="0" bordercolor="0">
  <tr>
    <td width="453" valign="top" background="images/homeBackground.jpg" class="BackNoRepeat">&nbsp;</td>
    <td width="742" align="right" valign="top"><table width="742" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td width="300" align="left" valign="top"><table border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td colspan="2"><img src="images/topLogo.jpg" width="300" height="128" /></td>
              </tr>
              <tr>
                <td align="left" valign="top"><img src="images/imgOpening.jpg" width="163" height="124" /></td>
                <td align="right" valign="top"><img src="images/rolloverMenu1.jpg" width="137" height="20" /><br />
                  <a href="recipes.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image15','','images/homeRecipesBTN_ov.jpg',1)"><img src="images/homeRecipesBTN.jpg" alt="Recipes" name="Image15" width="137" height="28" border="0" id="Image15" /></a><br />
                  <a href="nutrition.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image16','','images/homeNutritionBTN_ov.jpg',1)"><img src="images/homeNutritionBTN.jpg" alt="Nutrition" name="Image16" width="137" height="25" border="0" id="Image16" /></a><br />
                  <a href="webstore.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image17','','images/homeWebstore_ov.jpg',1)"><img src="images/homeWebstore.jpg" alt="Web Store" name="Image17" width="137" height="36" border="0" id="Image17" /></a><br />
                  <img src="images/home3.jpg" width="137" height="15" /></td>
              </tr>
            </table></td>
          <td width="442" background="images/mainBackground-right.jpg"><table width="441" border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td width="441" align="left" valign="top"><img src="images/topRight.jpg" width="442" height="71" /></td>
              </tr>
              <tr>
                <td><table width="442" border="0" cellpadding="0" cellspacing="0">
                    <tr>
                      <td width="235"><script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0','width','235','height','135','id','opening animation','align','','src','images/home','quality','high','bgcolor','#FFFFFF','name','opening animation','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','images/home' ); //end AC code
</script>
                        <noscript>
                        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"  codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="235" height="135" id="opening animation" align="">
                          <param name="movie" value="images/home.swf" />
                          <param name="quality" value="high" />
                          <param name="bgcolor" value="#FFFFFF" />
                          <embed src="images/home.swf" quality="high" bgcolor="#FFFFFF"  width="235" height="135" name="opening animation" align="" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
                        </object>
                        </noscript></td>
                      <td width="207" rowspan="2"><img src="images/main-top-right1.jpg" width="207" height="181" /></td>
                    </tr>
                    <tr>
                      <td height="47"><img src="images/main-top-right2.jpg" width="235" height="46" /></td>
                    </tr>
                  </table></td>
              </tr>
            </table></td>
        </tr>

this is where the space happens...and then the following code:
Code:

        <tr>
          <td colspan="2"><img src="images/home5.jpg" width="742" height="69"></td>
        </tr>
        <tr>
          <td colspan="2" align="left" valign="top"><table width="742" border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td width="224" align="left" valign="top"><img src="images/home6.jpg" width="224" height="57" /></td>
                <td width="251"><form action="" method="post" >
                    <table width="93%" border="0" align="center" cellpadding="0" cellspacing="0">
                      <tr>
                        <td width="29%" align="right">Username:</td>
                        <td width="34%"><input name="textfield" type="text" size="15"  style="font-size:.75em"/></td>
                        <td width="37%" rowspan="2"><input type="image" name="imageField" src="images/loginBTN.gif" /></td>
                      </tr>
                      <tr>
                        <td align="right">Password:</td>
                        <td><input name="textfield2" type="password" size="15" style="font-size:.75em"" /></td>
                      </tr>
                    </table>
                  </form></td>
                <td width="267" align="right" valign="top"><img src="images/home7.jpg" width="267" height="57" /></td>
              </tr>
            </table></td>
        </tr>
      </table>
      <div id="greenLineBack"></div>
      <div id="footer">&copy; Copyright 2007. All Rights Reserved.<img src="clear.gif" width="50" height="1"/><a href="#">RECIPES</a> | <a href="#">NUTRITION</a> | <a href="#">WEBSTORE </a></div></td>
    <td width="454" valign="top" background="images/mainBackground-right.jpg" class="BackNoRepeat2">&nbsp;</td>
  </tr>
</table>

I have stared and stared and STARED at my code, but I cannot figure out where the stray equal sign (=) comes from on this page. It shows up centered on the page between the "Log out" and the "Team"

Maybe another set of eyes can help. Thanks in advance.

Jo

http://www.bocachristian.org/preview/_pages/stray.php

I am trying to create a table that looks like the following:
_____________
|_______|____|
|___________ |
|___|________|

Here is the code I am using:

HTML Code:

#mainTable {
	width: 100%;
	padding: 0;
	margin: 0;
}

#headerLeft {
	padding: 10px 0 10px 10px;
	width: 606px;
}

#headerRight {
	margin-top: 25px;
	text-align: right;
	white-space: nowrap;
}

.orangeBar {
	margin: 0;
	padding: 0;
	font-size: 8px;
	background-color: #FFC342;
}

#navCell {
	width: 225px;
	vertical-align: top;
}

#contentCell {
	width: auto;
	vertical-align: top;
}
<table id="mainTable" border="1">
  <tr>
      <td id="headerLeft" colspan="2"><img src="images/logo.gif" width="596" height="60" alt="Our Logo" /></td>
      <td id="headerRight">Nav Links</td>
  </tr>
  <tr>
      <td colspan="3"><p class="orangeBar">&nbsp;</p></td>
  </tr>
  <tr>
      <td id="navCell">Nav</td>
      <td colspan="2" id="contentCell">
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a sem. Integer mattis justo eu nunc.</p>
      </td>
  </tr>
</table>

For some reason, the Nav cell in the last row is taking on the width of the image in the first cell, even though I want it to be 225px wide. I want the table to be the width of the page (100%).

Anyone have any ideas? I know it can be done by nesting two tables, I was just trying to avoid that. Thanks!

Just a quick edit, I added a bg color to headerLeft. Then I tested my code with the image removed, and the layout works they way I want, but as soon as I put it back, it is messed up again! The bg color I added confirms that the cell is the same size with and without the image.

Iv been creating an ebay listing on Frontpage, the pictures iv added to the page have been from my pc, next I click on the CODE tab at the bottom, I copy all the code, then I go into turbo lister and click the HTML tab, I paste the code in, then I click on preview, the pics are not there, just a little red x in the corner.

So Im thinking I should upload the Pics from my PC onto my server, (uk2) aswel as the whole file, in uk2 on the panel it shows EDIT HTML, it has all the pics there! then I click the CODE Tab and copy the code and pasted the code back into turbo lister, same thing, no pics again. Most of the time I figure these typs of things out before I get help, and this was is a real brain teaser! The filename is ebaylisting1, also it says the the file is a firefox Document

Please Advise, thank you

Hi,

I apologize if I'm posting in the wrong forum.

I've been trying to find out what I'm doing wrong for 5 days now with the contact form on the site I'm working on. So please help me out.

i'm using the AJAX contact form from http://www.dustindiaz.com/ajax-contact-form/ I've used it on at least 5 other site and they work grate, however on the site I'm working now I had so many issues, first I could not align it up, then somehow I fixed that, now that everything looks good, when u fill in the info in the form and click "send email" the whole form jumps of the site to the right. I just dont know why? I cant see why ?

I've been using this form on 5 other sites and the work Grate, except this site http://www.sadmir.com/DEMOS/ae2/contact.html

Please look at it, try it, and help me out if you can ....


Thank you

Hello All,

I've been having trouble with this table because I have interior cells adding to the confusion. I've included the current code, what you will see is three item images with their descriptions on the right side. You will also see a "view cart" button on the far right of the page.

What I want is a simple 2 row 2 column set up for all four components. "Item 1" in the TOP LEFT cell. "Item 2" in the Bottom Left. The "view cart" feature in the TOP RIGHT cell. And finally "Item 3" in the BOTTOM RIGHT cell. I know I only need a few <td> or <tr> lined up in the right place but I've tried everything.


THANK YOU IN ADVANCE!!!!


<!--// Document Style //-->

<style>
.product-image { border:none; }
.product-title, .product-price, .product-shipping { font-weight:bold; }
.data-cell { padding:0px 50px 0px 10px;vertical-align:top}
.align-cart { padding-left:280px; top:30pt;}
</style>

<!--// Document Table //-->

<table class="data-cell">
<tr class="product">
<td><img
src="images/stainless_thumbnail.gif" width="65" border="0" align="absmiddle" class="product-image"/></td>
<td class="data-cell">
<div class="product-title">
<div align="center">Item 1 Name</div>
</div>
<div class="product-price">
<div align="right">Price: $10.00</div>
</div>
<div class="product-shipping">Shipping: $3.00</div><br/>
<div class="googlecart-add-button"></div>
</td>
</tr>

<tr class="product">
<td><img
src="Item2_image.jpg" width="65" border="0" align="absmiddle" class="product-image"/>
</td>
<td class="data-cell">
<div class="product-title">
<div align="center">Item 2 Name</div>
</div>
<div class="product-price">
<div align="right">Price: $10.00</div>
</div>
<div class="product-shipping">Shipping: $3.00</div><br/>
<div class="googlecart-add-button"></div>
</td>
</tr>

<tr class="product">
<td><img
src="Item3_image.gif" width="66" border="0" align="absmiddle" class="product-image"/>
</td>
<td class="data-cell">
<div class="product-title">
<div align="center">Item 3 Name</div>
</div>
<div class="product-price">
<div align="right">Price: $10.00</div>
</div>
<div class="product-shipping">Shipping: $3.00</div><br/>
<div class="googlecart-add-button"></div>
</td>
</tr>
</table>

<!--// Document Script "View Cart" //-->

<script id="googlecart-script" type="text/javascript"
src="http://checkout.google.com/seller/gsc/v2/cart.js?mid=xyz"
currency="USD"
post-cart-to-sandbox="fale">
</script>

Hello everyone.

I am having the worst time trying to figure this one out. I created a site for a hair salon and every time the page loads for the first time, it jumps from right to left. Does anyone know why it is doing this? There is an example link below.

Thank you so much for taking the time to read this.

http://www.erizzo.net/studiod/index.html

Hello,

I've been trying to eliminate an unwanted vertical scrollbar on the following website:

http://www.sneezemag.com

I want to keep the horizontal scrollbar. The codes I have inserted seem to work for IE but none work for safari.

The page is framed and I have been searching for solutions but none seem to work. Most of the postings regarding unwanted scrollbars in safari are old now so was wondering if anyone can help me on this.

Thank you,

nic

Here... I don't know how to explain this, but I'm having a problem with IFrames.

Check out the link:
http://www.freewebs.com/noeylani94/index.htm

I want all three of them lined up horizontally

Hi,

I have a dynamic table which is updated on a form submission. I am trying to update the table without a page refresh so that the form doesn't reset itself back to its default settings thus avoiding the user constantly having to change the fields each time they enter a record. I was thinking of using an iFrame as this looks like a good and relatively easy way to achieve this.

Can someone please tell me how I can place a table within an iFrame and refresh just the Iframe contents on the form submission.

I hope someone can please help with the code.

Thanks

Simon

Hello! I'm trying to get iFrames to work in my HTML for my Twitch streaming profile.

Here is the coding for the HTML.

HTML Code:

<html>



<head>



<title>Twitch Info Html</title>



<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">



</head>



<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">



<!-- Save for Web Slices (Twitch Info Html.psd) -->



<table id="Table_01" width="630" height="724" border="0" cellpadding="0" cellspacing="0">



	<tr>



		<td colspan="3">



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_01.png" width="630" height="71" alt=""></td>



	</tr>



	<tr>



		<td rowspan="6">



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_02.png" width="12" height="653" alt=""></td>



		<td>



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_03.png" width="605" height="175" alt=""></td>



		<td rowspan="6">



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_04.png" width="13" height="653" alt=""></td>



	</tr>



	<tr>



		<td>



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_05.png" width="605" height="75" alt=""></td>



	</tr>



	<tr>



		<td>



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_06.png" width="605" height="165" alt=""></td>



	</tr>



	<tr>



		<td>



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_07.png" width="605" height="77" alt=""></td>



	</tr>



	<tr>



		<td>



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_08.png" width="605" height="143" alt=""></td>



	</tr>



	<tr>



		<td>



			<img src="http://runaru.webs.com/images/Twitch-Info-Html_09.png" width="605" height="18" alt=""></td>



	</tr>



</table>



<!-- End Save for Web Slices -->



<!-- --><script type="text/javascript" src="http://static.websimages.com/static/global/js/webs/usersites/escort.js"></script><script type="text/javascript">if(typeof(urchinTracker)=='function'){_uacct="UA-230305-2";_udn="none";_uff=false;urchinTracker();}</script></body>



</html>

I was wondering if anyone could tell me how I can get text over the boxes, so that the text somewhat overlays the image, and doesn't leave a white box.

Can iframes be used inside flash applications embeded on webpages so that when a button is clicked on a flash app, it activates an iframe on the actual webpage.

Is that possible?

Thanks.

This is a bit complicated but I'll try to explain it as best as I can.

I am trying to create a site which will contain information on a fairly large number of topics. In an effort to avoid creating a large number of pages to contain each topic I would like, if possible, to use one page with an iframe and load the topics into the iframe. These topics will come from external pages.

The iframe would look similar to this :

<iframe id="topic1" style="background-color:#ffffff" height="1000" width="970px" marginwidth="0" marginheight="0" frameborder="0" scrolling="yes"
src="http://someothersite.com/externalpage/"></iframe>

Since you can't use variables in html the problem, of course, is how to be able to change the src=" " in the iframe in order to be able to change topics (load a different external page).

I am looking for suggestions on how this might be done if it is indeed possible.

Any help would be very much appreciated.

Thanks