HTML - Black Background With Iframes
Alright, so on my webpage I want a black background and then have the iframes white. So, its white on black and the iframes are displayed over the black background.
This is how I want it to look and this is how it looks in Internet Explorer: http://i249.photobucket.com/albums/g...undiframes.jpg This is how it looks in Mozilla and I want it to look like the one up above: http://i249.photobucket.com/albums/g...undiframes.jpg Can someone tell me how I fix this? Similar TutorialsHi there, I know nothing formal about HTML, hence the code below being converted from an Open Office file. Hopefully it is readable - it is some declarations, a body with maybe 10 links in it, and then an embedded video code from Exposure Room. I have the alignment how I want it, but the background-black in the body doesn't work any more. Is anyone able to show me how to keep the center alignments I have but also switch the background of the whole page to black? It works if I take out the <center> tags but then everything is left aligned, which I don't like. Any help would be appreciated, cheers, Tony Code: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" "http://www.w3.org/TR/MathML2/dtd/xhtml-math11-f.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><!--This file was converted to xhtml by OpenOffice.org - see http://xml.openoffice.org/odf2xhtml for more info.--><head profile="http://dublincore.org/documents/dcmi-terms/"><meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/><title xml:lang="en-US">- no title specified</title><meta name="DCTERMS.title" content="" xml:lang="en-US"/><meta name="DCTERMS.language" content="en-US" scheme="DCTERMS.RFC4646"/><meta name="DCTERMS.source" content="http://xml.openoffice.org/odf2xhtml"/><meta name="DCTERMS.creator" content="Tony Wilkes"/><meta name="DCTERMS.issued" content="2011-04-17T19:59:38.83" scheme="DCTERMS.W3CDTF"/><meta name="DCTERMS.contributor" content="Tony Wilkes"/><meta name="DCTERMS.modified" content="2011-04-17T20:31:54.51" scheme="DCTERMS.W3CDTF"/><meta name="DCTERMS.provenance" content="" xml:lang="en-US"/><meta name="DCTERMS.subject" content="," xml:lang="en-US"/><link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" hreflang="en"/><link rel="schema.DCTERMS" href="http://purl.org/dc/terms/" hreflang="en"/><link rel="schema.DCTYPE" href="http://purl.org/dc/dcmitype/" hreflang="en"/><link rel="schema.DCAM" href="http://purl.org/dc/dcam/" hreflang="en"/><base href="."/><style type="text/css"> @page { } table { border-collapse:collapse; border-spacing:0; empty-cells:show } td, th { vertical-align:top; font-size:12pt;} h1, h2, h3, h4, h5, h6 { clear:both } ol, ul { margin:0; padding:0;} li { list-style: none; margin:0; padding:0;} <!-- "li span.odfLiEnd" - IE 7 issue--> li span. { clear: both; line-height:0; width:0; height:0; margin:0; padding:0; } span.footnodeNumber { padding-right:1em; } span.annotation_style_by_filter { font-size:95%; font-family:Arial; background-color:#fff000; margin:0; border:0; padding:0; } * { margin:0;} .P1 { font-size:12pt; font-family:Trebuchet MS; writing-mode:page; text-align:center ! important; color:#b3b3b3; } .T2 { font-size:10pt; } <!-- ODF styles with no properties representable as CSS --> { } </style></head><center><body dir="ltr" style="max-width:21.001cm;margin-top:2cm; margin-bottom:2cm; margin-left:2cm; margin-right:2cm; background-color:#000000; "><p class="P1">Lying Down</p><p class="P1">*</p><p class="P1"><a href="http://www.lyingdown.co.uk/index.xhtml">Trailer</a> * <a href="http://www.lyingdown.co.uk/part1med">Part 1</a> * <a href="http://www.lyingdown.co.uk/part2med">Part 2</a> * <a href="http://www.lyingdown.co.uk/part3med">Part 3</a> * <a href="http://www.lyingdown.co.uk/part4med">Part 4</a> * <a href="http://www.lyingdown.co.uk/part5med">Part 5</a> * <a href="http://www.lyingdown.co.uk/part6med">Part 6</a> * <a href="http://www.lyingdown.co.uk/part7med">Part 7</a> * Download</p><p class="P1"><span class="T2"/></p><p class="P1"><a href="http://www.lyingdown.co.uk/indexlow"><span class="T2">Lowest quality</span></a><span class="T2"> * </span><a href="http://www.lyingdown.co.uk/indexhigh"><span class="T2">Highest Quality</span></a></p><p class="P1"><span class="T2"/></p><p class="P1">*</p> <object id="xrPf8470a83ede543789fc18d1556be86e9" width="640" height="360" type="application/x-shockwave-flash" data="http://exposureroom.com/flash/XRVideoPlayer2.swf?domain=exposureroom.com/&assetId=f8470a83ede543789fc18d1556be86e9&size=md&titleColor=%23ffffff"><param name="movie" value="http://exposureroom.com/flash/XRVideoPlayer2.swf?domain=exposureroom.com/&assetId=f8470a83ede543789fc18d1556be86e9&size=md&titleColor=%23ffffff" /><param name="allowNetworking" value="all" /><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="True" /><param name="wmode" value="opaque" /></object><div><div class="viewOnXRDiv"><a href="http://exposureroom.com/f8470a83ede543789fc18d1556be86e9" class="viewOnXRLink" title="Lying Down trailer by Tony Wilkes - View it on ExposureRoom" target="_blank">View on ExposureRoom</a></div></div> </body></center> </html> Hey everyone, I'm trying to set my background image, but for some reason it has a large black bar at the bottom, where the pink gradient should actually start at the bottom so that you cant see the black bar? I'm trying to upload my Index.html file, but when I do the image loader says that its not a valid file? Any ideas? I am trying to remove the black borders or lines around my friends website and cant seem to do it? any ideas http://www.lavonnebeauty.com/ I'm stumped. I used a few tutorials and alot of trial and error to make this website. I'm happy with it for the most part but when I make the browser into a smaller window (same for computers using smaller resolution) and I get a scroll bar on the bottom, when I then use that scroll bar and move it to the right all I get is a black bar where content should be. Anyone have any idea what the deal is? I'm thoroughly confused. www.jessevadnaisphotography.com I assume that this should not be in the Flash section as it seems as the threads there are discussing problems within the Flash program, not putting Flash videos on your webpage. Anyway, I put my flash video on my website and it has black borders on the left and right sides of the video. I would like to remove them, but I don't know a whole lot about flash video parameters. Could anyone tell me how to do this? Here's my code for the index page: Code: <!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"> <head> <link rel="stylesheet" type="text/css" href="stylesheet.css"/> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/> <meta name="description" content="AV Avenue is a K-12 Classroom Technology Specialists company. We provide audio/video equipment sales, systems installations and service of existing systems."/> <meta name="keywords" content="av avenue, audio, video, audio visual, classroom, education, installation, smartboard, k-12"/> <title>AV Avenue</title> </head> <body> <ul id="stoplight"> <li id="stoplight1"><a href="index.html"></a></li> <li id="stoplight2"><a href="aboutus.html"></a></li> <li id="stoplight3"><a href="contactus.html"></a></li> </ul> <div id="stoplightbottom"> <img src="Images/Home Page/StoplightBottom.png" alt=""/> </div> <div id="smartboard"> <img src="Images/Home Page/Smartboard.png" width="180" height="180" alt=""/> </div> <div id="featuredpartner1"> <img src="Images/Home Page/AviSPLLogo.png" width="140" height="60" alt=""/> </div> <div id="featuredpartner2"> <img src="Images/Home Page/UnitedVisualLogo.png" width="140" height="60" alt=""/> </div> <div id="featuredpartnertext"> <span class="blackfont2 comicsansms">SMART Board Partners</span> </div> <div id="specials"> <img src="Images/Home Page/MaySpecials.png" alt="Check out our special services for May!"/> </div> <div id="text2"> <img src="Images/Home Page/Text2.png" alt=""/> </div> <div id="avsign"> <img src="Images/Home Page/AVAvenueLeftSign.png" alt=""/> </div> <div id="states"> <img src="Images/Home Page/States.png" alt=""/> </div> <div id="contractorstext"> <span class="blackfont1 comicsansms">Technology Systems Contractors Power Limited Technicians</span> </div> <div id="company1"> <img src="Images/Home Page/Company1.png" height="30" width="100" alt=""/> </div> <div id="company2"> <img src="Images/Home Page/Company2.png" height="30" width="100" alt=""/> </div> <div id="company3"> <img src="Images/Home Page/Company3.png" height="30" width="100" alt=""/> </div> <div id="company4"> <img src="Images/Home Page/Company4.png" height="30" width="100" alt=""/> </div> <div id="company5"> <img src="Images/Home Page/Company5.png" height="30" width="100" alt=""/> </div> <div id="flashmovie"> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="300" height="400" id="AV_Ave" align="middle"> <param name="movie" value="AV_Ave.swf"/> <param name="quality" value="high"/> <param name="play" value="true"/> <param name="bgcolor" value="#000000"/> <param name="loop" value="true"/> <param name="wmode" value="window"/> <param name="scale" value="showall"/> <param name="menu" value="true"/> <param name="devicefont" value="false"/> <param name="salign" value=""/> <param name="allowScriptAccess" value="sameDomain"/> <object type="application/x-shockwave-flash" data="AV_Ave.swf" width="600" height="400"> <param name="movie" value="AV_Ave.swf"/> <param name="quality" value="high"/> <param name="play" value="true"/> <param name="bgcolor" value="#000000"/> <param name="loop" value="true"/> <param name="wmode" value="window"/> <param name="scale" value="showall"/> <param name="menu" value="true"/> <param name="devicefont" value="false"/> <param name="salign" value=""/> <param name="allowScriptAccess" value="sameDomain"/> <a href="http://www.adobe.com/go/getflash"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player"/> </a> </object> </object> </div> </body> </html> and here's my CSS: Code: * {margin:0; padding:0;} html, body, div, span,object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strike, strong, sub, sup, tt, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; } table { border-collapse: collapse; border-spacing: 0; } textarea { overflow:auto; } ul#stoplight { margin: 0px 840px; width: 0px; height: 0px; list-style: none; } ul#stoplight li { display:inline; } ul#stoplight li a { float:left; text-indent:-9999px; text-decoration:none; } ul#stoplight li#stoplight1 a { width:178px; height:82px; background:url(Images/Stoplights.png) no-repeat 0 0; } ul#stoplight li#stoplight1 a:hover { background-position: -221px 0; } ul#stoplight li#stoplight2 a { width:178px; height:63px; background:url(Images/Stoplights.png) no-repeat 0 -82px; } ul#stoplight li#stoplight2 a:hover { background-position: -221px -83px; } ul#stoplight li#stoplight3 a { width:179px; height:66px; background:url(Images/Stoplights.png) no-repeat 0 -145px; } ul#stoplight li#stoplight3 a:hover { background-position: -221px -144px; } body { background-image: url('Images/GradientBackground.png'); background-repeat: repeat-x; } .arial {font-family: Arial;} .tahoma {font-family: Tahoma;} .verdana {font-family: Verdana;} .comicsansms {font-family: Comic Sans MS;} .underline {text-decoration: underline} .blackfont1 {font-size: 16px;} .blackfont2 {font-size: 24px;} .whitetext1 {color: #F2F2F2; font-size: 30px;} .whitetext2 {color: #EBEBEB; font-size: 17px;} .whitetext3 {color: #DBDBDB; font-size: 18px;} #background {top: 2.7em; left: 4em; position:absolute; z-index: -2; visibility: visible;} #stoplightbottom {margin: 211px 840px; position: absolute; z-index: 1; visibility: visible;} #featuredpartnertext {margin: 230px 980px; position: absolute; z-index: 1; visibility: visible; width: 300px;} #smartboard {margin: 270px 1020px; position: absolute; z-index: 1; visibility: visible;} #featuredpartner1 {margin: 460px 960px; position: absolute; z-index: 1; visibility: visible;} #featuredpartner2 {margin: 460px 1110px; position: absolute; z-index: 1; visibility: visible;} #specials {margin: 550px 1020px; position: absolute; z-index: 1; visibility: visible;} #text2 {margin: 650px 155px; position: absolute; z-index: 3; visibility: visible;} #avsign {margin: -5px 50px; position: absolute; z-index: 1; visibility: visible;} #states {margin: 90px 540px; position: absolute; z-index: 1; visibility: visible;} #contractorstext {margin: 30px 530px; position: absolute; z-index: 1; visibility: visible; width: 250px;} #company1 {margin: 210px 250px; position: absolute; z-index: 1; visibility: visible;} #company2 {margin: 210px 350px; position: absolute; z-index: 1; visibility: visible;} #company3 {margin: 210px 450px; position: absolute; z-index: 1; visibility: visible;} #company4 {margin: 210px 550px; position: absolute; z-index: 1; visibility: visible;} #company5 {margin: 210px 650px; position: absolute; z-index: 1; visibility: visible;} #contactinfo {margin: 270px 170px; position: absolute; z-index: 2; visibility: visible;} #contactimage {margin: 270px 170px; position: absolute; z-index: 1; visibility: visible;} #greenbackground {margin: 230px 170px; position: absolute; z-index: 1; visibility: visible;} #greybackground {margin: 230px 170px; position: absolute; z-index: 1; visibility: visible;} #aboutusheader {margin: 240px 260px; position: absolute; z-index: 2; visibility: visible; width: 600px;} #aboutusparagraph {margin: 290px 180px; position: absolute; z-index: 2; visibility: visible; width: 630px;} #list1 {margin: 400px 190px; position: absolute; z-index: 2; visibility: visible; width: 200px;} #list2 {margin: 400px 400px; position: absolute; z-index: 2; visibility: visible; width: 200px;} #list3 {margin: 400px 610px; position: absolute; z-index: 2; visibility: visible; width: 200px;} #flashmovie {margin: 240px 200px; position: absolute; z-index: 2; visibility: visible; width: 300px;} My website is www.avavenue.com. Thanks a ton to anyone who helps out . Hello, Thefallenshadow has been helping me with my website and introducing me to CSS because I am new to web design, but unfortunely he has not replied to my PM so I am posting here for help. I was about to start adding images of my work to my website, however it appears the website background images are not aligned correctly, even after I made sure they are the exact same pixel dimensions as the actual images. If someone could download my website below and view the index.html page (or view picture below), you will notice thin black horizontal lines in several places. The UFO picture in the corner is also not correct. These black lines appear in Internet Explorer, FrontPage and Dreamweaver but do not show inside Firefox. What's causing this? I am not sure how to fix it. http://homepage.ntlworld.com/stephan.../Portfolio.zip Thanks On this page: http://tinyurl.com/charpages The font is currently navy blue and I can't get it black with the <font color="black"> TEXT </font> tag. Help? Both Google Chrome 12.0.742.91 and Safari 5.0.5 (Both on Mac) seem to be giving me problems. Google Chrome is causing the most headache. When I go to my website at www.schenkhampton.com/airtex2 It looks fine at first look. However, if you click refresh you will see like what I have in photo one where it looks like a block is covering part of the logos on the bottom. But, if you click one of the dropdowns or resize the browser window it corrects itself. Both Safari and Google are having that problem. Safari is doing two different versions of blocking the footer logos as you can see in the photos below. Then in Google when you open up all of the dropdowns you will scroll down and notice black bars appear. However, again if you resize your browser window or scroll far enough away from the black bar and come back it is gone. So, part of me says it is not code...cause code would stay. I recently changed the css sheet and validated everything. Everything clears fine. I even went back and put in the original style sheet cause I dont remember ever seeing that before and I still had the same issue. I even tried to do it with a version that I saved back on May 24 of both the page and css when I first started building this site. Same issue. I am not seeing any of these issues in firefox. I am at a loss cause it doesnt even make sense to me what could be causing these issues so any help would be appreciated. Matt I have a page with a black background, and a script so that when a link is clicked the page fades out and then redirects to the link location. Since the background is black, the page fades to black before redirecting. How can I have it fade to white and then redirect? Good Morning, I am placing an iframe on my site, this is working well but I would like to have the website page represented in the iframe to fill my frame 100% as viewed by the viewer.. Currently I have a horizontal scroll bar on the bottom of my frame.. I would like to not need this but to be able to see the full width of that site in my iframe. Is there a way to achieve this? Thank You David 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 hi all... I am working with iframes on a website I am designing. My question is this... If users scroll all the way to the bottom of the page and click a link, how do you restore the index page all the way to the top, while loading the requested page within the iframe? Hi, I have a webpage which a friend of mine designed a long time ago. I'm not an HTML expert but I know the base things, and the problem is that my site don't use iframes, instead there are tables. I have many pages and the navigation links are on every single page. It's really a pain in the neck to change all pages to modify a navigation link. This is how the HTMl looks: Code: <body> <table width="800" border="0" cellpadding="0" cellspacing="0" class="main" align="center"> <tr><td colspan="2">Head image there</td></tr> <tr><td class="left"> <!--START OF NAVIGATION--> Navigation links are here <!--END OF NAVIGATION--> <td class="content"> <!--START OF CONTENT--> CONTENT HERE <!--END OF CONTENT--> </center></td></tr> <tr><td colspan="2" class="footer"> <!--START OF FOOTER--> This is the footer <!--END OF FOOTER--> </td></tr></table> </body> </html> A pictu Now my question would be that is it possible to put the navigation in a frame but keep the whole site layout the same? I mean, I would like to keep the scrolling the same - Have only 1 scrollbar and when scrolling, scroll the whole page, the navigation and the main content too. Thank you very much for any help! Hi, this is my first post here. I uploaded my webpage http://inferno.comxa.com to the server of 000webhost.com When I tried to view them through various browsers, I found that the height attribute of the iframe tag was not responding in any browser except Chrome (12.0). I used the following browsers for checking: IE 8, Firefox 5.0, Opera 11, Chrome 12.0 This is my code Code: <body> <iframe src = "top-right.html" height = "23%" width = "15%"></iframe> <iframe src = "top.html" height = "23%" width = "83%"></iframe><br> <iframe src = "topics.html" height = "77%" width = "15%"></iframe> <iframe src = "home.html" height = "77%" width = "83%" name = "main"></iframe> </body> This is what I was able to see However when I ran a similar code on the editor of w3schools.com, it came out fine in all browsers. This is what I see in w3schools editor What is happening ? why such anomaly ? Help is appreciated. I also tried to replace the attributes of the iframe tag with CSS, but i found the same thing. Looks fine with Chrome but the height was not being registered with any other browser. This is my exact html code Code: <!doctype html> <html> <head> <link rel="stylesheet" type="text/css" href="default.css" /> <meta http-equiv="Content-type" content="text/html;charset=UTF-8"> </head> <body style="height:100%;background-color:black;" > <iframe src="" style="height:25%; width:15%;"></iframe> <iframe src="" style="height:25%; width:83%;"></iframe><br> <iframe src="" style="height:75%; width:15%;"></iframe> <iframe src="" style="height:75%; width:83%;" name = "main"></iframe> </body> </html> and this is my stylesheet Code: *{background-color:black;color:white;} html{background-color:black;color:white;} h1{font-size:250%;text-align:center;color:yellow;background-color:black;} h2{font-size:175%;text-align:left;background-color:black;color:white;} body{background-color:black;color:white;font-size:120%;} p:first-letter{font-size:150%;color:red;background-color:black;} a:link{color:blue;background-color:black;} a:visited{color:blue;background-color:black;} a:hover{color:yellow;background-color:black;} a:active{color:white;background-color:black;} this is what I saw in IE8 http://html.net/forums/download/file.php?id=55 By the way, in IE8 i get a white space in the frames whereas in Firefox/Chrome/Opera , it comes out black. Anything with CSS compatibility? Okay, here's the situation. 1) The client uses a catalog service that he likes and wants to keep, but hates the way their pages look. 2) Their Layouts aren't really customizable so I plop their info into another page using an iframe. This page is hosted on a different server than the content. 3) Annoyingly, iframes don't stretch to fit their contents, so if I set the height to accomdate all possible pages, I'm left with a silly amount of space at the bottom of most pages. I can't add code to the interior pages. I've looked around, but nothing seems to work. Any ideas? instead of doing frames i've put all my contents into an Iframe with 3 links underneth. Problem is, when you click a link it goes onto a different page, how do i make the link'ed contents appear in the iframe? I hope i make sense! Can you make me 3 frames? 1. On the left side[Want it to be 20% of the site's width] which will have the general links. 2. One on the right side[80% of the width] 3. One on the top[20% of the height] They can be totally blank, I'll enter the content myself. Thank you. 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. I'm using frames now and I really don't like it. Can you change it to iframes? The problem is, at the top row, when some one clicks a link button it takes you to the link but only keeps in it on the top page. Here's the frameset notepad: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <title>PokeCosmo -The future of pokemon</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <frameset rows="20%,80%"> <frame img border="0" src="column.html"> <frameset cols="20%,80%"> <frame src="framerow.html"> <frame src="column6.html"> </frameset> <noframes> <p>This frameset document contains:</p> <ul> <li><a href="#">Row_1 contents</a></li> <li><a href="#">Row_2 column_1 contents</a></li> <li><a href="#">Row_2 column_2 contents</a></li> </ul> </noframes> </frameset> <div id="footer"> <div>PokйCosmo.com © 2007. All rights reserved.</div> The second column: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "" > <html lang="en"> <head> <title>PokCosmo</title> <base href="http://www.pokecosmo.com/"> <meta name="keywords" content="pokemon, online pokemon, pokemon articles, netbattle tutorials, pokemon projects, pokemon forums, pokemon community, pokemon pokedex, battle competitor, netbattle, pokemon netbattle, pokemon art, pokemon fanart, pokemon diamond and pearl,free, pokemon ruby and saphire, pokemon emerald, pokemon ruby, pokemon saphire, pokemon cheat codes, pokemon hacks."> <meta name="robots" content="PokйCosmo Front Page 4.0"> <link rel="stylesheet" media="all" type="text/css" href="default.css"> <link rel="alternate stylesheet" type="text/css" media="all" title="style1" href="style1.css"> <link rel="alternate stylesheet" type="text/css" media="all" title="style2" href="style2.css"> <style type='text/css'> body { background-image : url('!--Post link here--!'); } </style> <script src="styleswitch.js" type="text/javascript"> </script> <body bgcolor="black"> <head> <style type="text/css"> h1 {color: silver} </style> </head> <body> <img align="top" src="http://img340.imageshack.us/img340/3342/diamondandpearlcs3.png"><h1> Pokemon Diamond and Pearl- In stores Now!!! <img align="left" src="http://img249.imageshack.us/img249/953/diamondyr4.jpg"> <img align="right" src="http://img522.imageshack.us/img522/4228/pearlrd5.jpg"> <div>PokйCosmo.com © 2007. All rights reserved.</div> <a align="bottom" href="http://www.pokecosmo.com">Home</a> | <a href="http://www.pokecosmo.com/forums">Forums</a> | <a href="netbattle">Pokemon Netbattle</a> | <a href="pokemonol>Online RPG</a> | <a href="pokedex">PokeDex</a> | <a href="contact">Contact Us</a> | <a href="affiliates">Affiliates</a>| <a href="copyright">Copyright</a>|<a href="content">Content rating</a> </div> <!--Affiliation partners=pokeelite2000,psypokes.com--> The sucky first column: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "" > <html lang="en"> <head> <title>PokCosmo</title> <base href="http://www.pokecosmo.com/"> <meta name="keywords" content="pokemon, online pokemon, pokemon articles, netbattle tutorials, pokemon projects, pokemon forums, pokemon community, pokemon pokedex, battle competitor, netbattle, pokemon netbattle, pokemon art, pokemon fanart, pokemon diamond and pearl,free, pokemon ruby and saphire, pokemon emerald, pokemon ruby, pokemon saphire, pokemon cheat codes, pokemon hacks."> <meta name="robots" content="PokйCosmo Front Page 4.0"> <link rel="stylesheet" media="all" type="text/css" href="default.css"> <link rel="alternate stylesheet" type="text/css" media="all" title="style1" href="style1.css"> <link rel="alternate stylesheet" type="text/css" media="all" title="style2" href="style2.css"> <style type='text/css'> body { background-image : url('http://img294.imageshack.us/img294/7408/siteiz8'); } </style> <script src="styleswitch.js" type="text/javascript"> </script> <body bgcolor="gray" text="red"> <div id="left_side"> <div id="left_side_menus"> <img src="http://img238.imageshack.us/img238/3926/sitefv0.png"> <ul> <li><a href="contact">Contact</a></li> <li><a href="history">History</a></li> <li><a href="main">Main</a></li> </ul> <img src="http://img265.imageshack.us/img265/2431/projectsxy3.png"> <ul> <li><a href="pokemononline">POL RPG</a></li> <li><a href="netbattle">Competitor</a></li> <li><a href="graphics">Graphic Projects</a></li> </ul> <img src="http://img299.imageshack.us/img299/6435/downloadswk7.png"> <ul> <li><a href="downloadrpg">POL RPG</a></li> <li><a href="downloadnetbattle">Netbattle</a></li> </ul> <img src="http://img293.imageshack.us/img293/395/communityuo0.png"> <ul> <li><a href="forum/Login.php">Login</a></li> <li><a href="forum/register.php">Free Registration</a></li> <li><a href="forum/showthread.php?p=thread.php">Forum Rules</a></li> <li><a href="forum/reportabuse.php">Report Abuse</a></li> </ul> The crappy row: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <title>A simple two rows, two columns frameset document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body bgcolor="black" <a href="www.pokecosmo.com"><img align="left"src="http://img152.imageshack.us/img152/5646/pokecosmosett2.png"></a> <a align="right" href="www.pokecosmo.com/pokegames"><img border="0" src="http://img523.imageshack.us/img523/7470/pokemongamesfz9.gif"></a> <a href="www.pokecosmo.com/projects"><img border="0"src="http://img511.imageshack.us/img511/6365/projectsjv5.gif"></a> <a href="www.pokecosmo.com/pokedex"><img border="0"src="http://img525.imageshack.us/img525/1631/pokedexqc0.gif"></a> <a href="www.pokecosmo.com/netbattle"><img border="0"src="http://img525.imageshack.us/img525/2083/netbattlemp1.gif"></a> <a href="www.pokecosmo.com/forums"><img border="0"src="http://img153.imageshack.us/img153/3989/forumsgc0.gif"></a> and if you could, for the second column could you change the text(expect for the heading) orange and much much smaller? 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 |