954,598 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?
Have something to say? Contribute New Article Reply to this Article

iframe background color

What am i doing wrong? My iframe background stays white.
It must be black.
Can anyone help me plz?

<HTML>
<HEAD>
<TITLE>Untitled-1</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body { background-color:#000000;
}
-->
</style></HEAD>
<BODY BGCOLOR="#000000" LEFTMARGIN="0" TOPMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0">
<!-- ImageReady Slices (Untitled-1) -->
<TABLE WIDTH="1024" BORDER="0" CELLPADDING="0" CELLSPACING="0">
<TR>
		<td COLSPAN="8" style="background: url('images/banner.gif'); width:1024px; height:52px" valign="top">&nbsp;  </td>
		
	</TR>
	<TR>
		<td ROWSPAN="2" style="background: url('images/banner_02.gif'); width:115px; height:716px" valign="top">&nbsp;  </td>
		
		<TD>
			<A HREF="C:\charissa\cbackup\Prijzen\prijzen.html" TARGET="index">
				<IMG SRC="images/prijzen.gif" WIDTH=169 HEIGHT=53 BORDER=0 ALT="Prijzen"></A></TD>
		<TD>
			<A HREF="C:\charissa\cbackup\informatie.html" target="index">
				<IMG SRC="images/Info.gif" WIDTH=101 HEIGHT=53 BORDER=0 ALT="Informatie"></A></TD>
		<TD>
			<A HREF="/heren/heren.html">
				<IMG SRC="images/men.gif" WIDTH=88 HEIGHT=53 BORDER=0 ALT="Heren kapsels"></A></TD>
		<TD>
			<A HREF="/dames/dames.html">
				<IMG SRC="images/women.gif" WIDTH=114 HEIGHT=53 BORDER=0 ALT="Dames kapsels"></A></TD>
		<TD>
			<A HREF="/afspraak.html">
				<IMG SRC="images/afspraak.gif" WIDTH=164 HEIGHT=53 BORDER=0 ALT="Afspraak maken"></A></TD>
		<TD>
			<A HREF="/aanb/aanb.html">
				<IMG SRC="images/aanbieding.gif" WIDTH=199 HEIGHT=53 BORDER=0 ALT="Aanbiedingen"></A></TD>
		<TD ROWSPAN=2>
			<IMG SRC="images/rechts.gif" WIDTH=74 HEIGHT=716 ALT=""></TD>
	</TR>
	<TR>	
	  <td COLSPAN="6" bordercolor="#000000" background="images/index.gif" bgcolor="#000000" style="background: #000000; width:835px; height:663px"><iframe frameborder="0" height="100%" width="100%"  name="index" style="background-color:"#000000" ></iframe>
      &nbsp;  </td>
		
  </TR>
</TABLE>
<!-- End ImageReady Slices -->
</BODY>
</HTML>
freggel2
Newbie Poster
1 post since Sep 2009
Reputation Points: 10
Solved Threads: 0
 

freggel2,

You need to style the document(s) that appear in the iframe with a black background, rather than the iframe itself.

Airshow

Airshow
WiFi Lounge Lizard
Moderator
2,683 posts since Apr 2009
Reputation Points: 321
Solved Threads: 372
 
What am i doing wrong? My iframe background stays white. It must be black. Can anyone help me plz?

you can also watch here for more universal solution and controll over the Iframe background color from its parent.

The script allows you to set the background color of your iframe(s) from its parent and/or default/adopt to the main page background color automaticaly.

Troy III
Practically a Master Poster
609 posts since Jun 2008
Reputation Points: 120
Solved Threads: 80
 

Edited response and reposted below

lbechtum
Newbie Poster
5 posts since Oct 2009
Reputation Points: 10
Solved Threads: 0
 

Not sure if you are still monitoring this thread but if you are I did some research on this for a class that I am teaching. There are a lot of elitist responses out there concerning this question. They hate iframes, they hate microsoft, they like to belittle those who do not already have the answer. The bottom line is that when the viewer of the web page is using internet explorer (older or new) they will always see a white background. It is true as many respondents have chided those seeking an answer, that the color of the document will determine the background color, dah.

Iframes are a good choice for displaying image galleries and when you display a gallery in an Iframe you typically do not put the image on a page with a background and images have a habit of being different sizes and orientations. When you have variatiions in dimensions and orientation you wind up with the white background showing through. You are not left without options but each one requires addtional work or a different gallery display choice.

1. You could put each image on a seperate html page with a background color that matches the page or table background color. For best results put the image inside of a table that matches the size of he iframe and use a background color in the table that matches the page color.
2. You could, and this is the option I use when working with an Iframe presentation, first do your image work and make each image exactly the same dimension as the rest. If I have an image that is a different orientation then I create a new image into which I place the original. The new image has a background that is of the same size and layout as the rest of the images and has a background color appropriate for the page I am lookng at. Your odd image is floating in the larger new image with a background around it.
3. Create a slide show using javascript, Adobe Photoshop or a javascript editor. In each case you can define a background color. Expression Web has display options within the toolbox taskpane that you can place a slide show done with Adobe.

Hope this helps

lbechtum
Newbie Poster
5 posts since Oct 2009
Reputation Points: 10
Solved Threads: 0
 
The bottom line is that when the viewer of the web page is using internet explorer (older or new) they will always see a white background. It is true as many respondents have chided those seeking an answer, that the color of the document will determine the background color, dah.


I'm not sure I understand. Are you saying that IE will always give an iframe a white background (regardless of the document displayed in it)? Or are you saying that such advice is incorrect?Airshow

Airshow
WiFi Lounge Lizard
Moderator
2,683 posts since Apr 2009
Reputation Points: 321
Solved Threads: 372
 

Wrong code:
<iframe frameborder="0" height="100%" width="100%" name="index" style="background-color:"#000000" > </iframe>

Instead of style="background-color:"#000000"
write style="background-color:'#000000' "
The quotations are not properly closed.

koyel555
Light Poster
29 posts since Aug 2009
Reputation Points: 10
Solved Threads: 0
 

I'm not sure I understand. Are you saying that IE will always give an iframe a white background (regardless of the document displayed in it)? Or are you saying that such advice is incorrect?

Airshow

What I am saying, is, in the abscence of a page or image present in the iframe the background color will be white regardless of what code you add. If no document or picture is present the color inside of the Iframe, the background will be white when using IE.

lbechtum
Newbie Poster
5 posts since Oct 2009
Reputation Points: 10
Solved Threads: 0
 

lbechtum,

What I am saying, is, in the abscence of a page or image present in the iframe the background color will be white regardless of what code you add. If no document or picture is present the color inside of the Iframe, the background will be white when using IE.


Now I'm really confused.

If the first statement is true, then it seems to me that the second statement MUST also be true. What does the second statement say about IE that is not already covered by the first?Airshow

Airshow
WiFi Lounge Lizard
Moderator
2,683 posts since Apr 2009
Reputation Points: 321
Solved Threads: 372
 

both statements say the same thing....you cannot control the background color of an Iframe when viewing it using IE. The only time the background color will be other than white is when the background color of the content being displayed inside of the Iframe has a color other than white.

lbechtum
Newbie Poster
5 posts since Oct 2009
Reputation Points: 10
Solved Threads: 0
 

Exactly what I said, very concisely, in post #2 - the first reply to this thread. :icon_rolleyes:

Airshow

Airshow
WiFi Lounge Lizard
Moderator
2,683 posts since Apr 2009
Reputation Points: 321
Solved Threads: 372
 

Add this stupid nonstandard IE-only attribute to the iframe tag, and IE will behave more-or-less like the W3 standard suggests:

<iframe src="..." allowtransparency="true"></iframe>
ZootAllures
Newbie Poster
15 posts since Mar 2010
Reputation Points: 10
Solved Threads: 1
 

You need to style the document(s) that appear in the iframe with a black background, rather than the iframe itself.

cutecub11
Newbie Poster
1 post since Mar 2010
Reputation Points: 10
Solved Threads: 0
 

Yes, you can style the iframe contents as per usual, but it can be difficult to exactly fill the iframe exactly. Any gap between the content and the outside of the iframe get colored white and the iframe ignores any background styles (maybe it ignores styles altogether; I don't know).

What I do know is that adding the allowtransparency="true" attribute to the iframe allows the underlying background to show through, as I mentioned above.

ZootAllures
Newbie Poster
15 posts since Mar 2010
Reputation Points: 10
Solved Threads: 1
 

I thought this old thread was dead but it's good to learn about allowtransparency . Could be useful one day.Airshow

Airshow
WiFi Lounge Lizard
Moderator
2,683 posts since Apr 2009
Reputation Points: 321
Solved Threads: 372
 

I got sick to death of threads all over the internet that asked the question but never had the answer, so when I found the answer I went around and rejuvenated a bunch of dead threads, including this one.

It's a problem with forums everywhere.

ZootAllures
Newbie Poster
15 posts since Mar 2010
Reputation Points: 10
Solved Threads: 1
 

Thanks Zoot, that's very public spirited of you.

Must spin up my "Hot Rats" some time

Airshow

Airshow
WiFi Lounge Lizard
Moderator
2,683 posts since Apr 2009
Reputation Points: 321
Solved Threads: 372
 

This article has been dead for over three months

Post: Markdown Syntax: Formatting Help
You