HTML - Iframe Not Showing Up In Ie Or Chrome But Shows Up In Mozilla
Hello
The company I am with has recently launched a website. I am very new to HTML code. I have been teaching myself over the last month or so. Here is the code I am having trouble with: <div style="float:left"<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com/xxxxxxxxxxxamp;width=292&colorscheme=light&show_faces=true&stream=true&header=true&a mp;height=427" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:427px;" allowTransparency="true"></iframe></div> <div style="float:right"<script src="http://widgets.twimg.com/j/2/widget.js"></script> <script> new TWTR.Widget({ version: 2, type: 'profile', rpp: 5, interval: 6000, width: 250, height: 290, theme: { shell: { background: '#2b779a', color: '#e6eaf2' }, tweets: { background: '#eee2b9', color: '#2b779a', links: '#2a9c13' } }, features: { scrollbar: true, loop: false, live: true, hashtags: true, timestamp: true, avatars: true, behavior: 'all' } }).render().setUser('xxxxxxxxx').start(); </script></div><div style="clear:both"></div> The images show up on Mozilla but not IE or Chrome. These are just codes I copied from FB and Twitter. I then added in the <div> so that they would line up side by side. Obviously I am a beginner, please be gentle. Thanks so much in advance. Similar Tutorialsthere is my code. any reason why it looks good in chrome/safari but it looks bad in mozilla? in mozilla it has a bunch of lines going through it and the images are all seperated. any help would be much appreciated. Thanks, George 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> <title>share</title> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <style type="text/css"> body { background-color: #ffffff; background-image: url(../background-for-website.png); background-repeat: repeat-x; } #apDiv1 { z-index:1; } </style> </head> <body> <!-- Save for Web Slices (share.psd) --> <center> <table id="Table_01" width="792" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="5"> <img id="share_01" src="images4/share_01.png" width="791" height="155" alt="" /></td> <td> <img src="images4/spacer.gif" width="1" height="155" alt="" /></td> </tr> <tr> <td colspan="5"> <img id="share_02" src="images4/share_02.png" width="791" height="137" alt="" /></td> <td> <img src="images4/spacer.gif" width="1" height="137" alt="" /></td> </tr> <tr> <td colspan="5"> <img id="share_03" src="images4/share_03.png" width="791" height="142" alt="" /></td> <td> <img src="images4/spacer.gif" width="1" height="142" alt="" /></td> </tr> <tr> <td colspan="3" rowspan="2"> <img id="share_04" src="images4/share_04.png" width="544" height="70" alt="" /></td> <td> <div class="apDiv" id="apDiv"><a href="http://www.facebook.com/sharer.php?u=https://www.facebook.com/pages/itunes-cards-for-free/200510223345141" target="_blank"> <img id="share_05" src="images4/share_05.png" width="137" height="21" alt="" /> </a></div> </td> <td rowspan="4"> <img id="share_06" src="images4/share_06.png" width="110" height="257" alt="" /></td> <td> <img src="images4/spacer.gif" width="1" height="21" alt="" /></td> </tr> <tr> <td rowspan="3"> <img id="share_07" src="images4/share_07.png" width="137" height="236" alt="" /></td> <td> <img src="images4/spacer.gif" width="1" height="49" alt="" /></td> </tr> <tr> <td rowspan="2"> <img id="share_08" src="images4/share_08.png" width="319" height="187" alt="" /></td> <td><a href="../page 5/redeem.html"><img src="images4/button.png" onmouseover="this.src='images4/button-3.png'" onmouseout="this.src='images4/button.png'"/></a> </td> <td rowspan="2"> <img id="share_10" src="images4/share_10.png" width="75" height="187" alt="" /></td> <td> <img src="images4/spacer.gif" width="1" height="30" alt="" /></td> </tr> <tr> <td> <img id="share_11" src="images4/share_11.png" width="150" height="157" alt="" /></td> <td> <img src="images4/spacer.gif" width="1" height="157" alt="" /></td> </tr> </table> </center> <!-- End Save for Web Slices --> </body> </html> Hello! I hope that someone in this forum can help me solve the mystery that has been giving me a headache for two days now. I have a page that has a couple of iframes in it. when I view the page in firefox they show perfectly fine, however when viewed with IE one loads but the second one only shows a blank white page. They reside in a table, and are in a single row of that table. the code looks like this: <tr><td width="535" height="285" colspan="6" bgcolor="#FFFFFF"> <iframe frameborder="0" scrolling="auto" width="535" height="285" src="/members/updates.html"></iframe></td> <td width="5" height="285" bgcolor="#FFFFFF"> <img src="/members/graphics/spacer.gif" width="5" height="285" border="0"></td> <td colspan="2" background="/members/graphics/newsbg.jpg" width="240" height="285" alt="" border="0"><iframe frameborder="0" scrolling="auto" width="240" height="285" src="/members/news.html"></iframe></td> </tr> Is there some reaso that the second one isn't showing? I have two different pages that are designed like this. They look fine in firefox 1.5. IE gives me nothing. Hi, i have a site with iframes. By opening the page with IE is ok, but Mozilla can't open it. So, this is the code: Quote: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> </head> <frameset rows="*" cols="80,*" frameborder="no" border="0" framespacing="0"> <frame src="file:///C|/frame2.html" name="leftFrame" scrolling="No" noresize="noresize" id="leftFrame" title="leftFrame"> <frameset rows="80,*" frameborder="no" border="0" framespacing="0"> <frame src="file:///C|/frame3.hml" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" title="topFrame"> <frame src="file:///C|/frame1.hml" name="mainFrame" id="mainFrame" title="mainFrame"> </frameset> </frameset> <noframes><body> </body> </noframes></html> Can somebody help me to find the problem? Hi all -- I'm having a problem. I have a series of 8 images that make up my navigation bar for the website I'm making. Each image has an <a href=" ... > </a> tag around it. I have zeroed out all of the padding/margins/borders on all of the images (in CSS and HTML). The problem I'm having is that a 2-3px padding is showing up to the left of each image, but only in Internet Explorer. Firefox and Chrome do not show the padding. To clarify, I DO NOT want the padding to be displayed. Here is my CSS: Code: <style type="text/css"> <!-- body { font: 100% Verdana, Arial, Helvetica, sans-serif; background: #666666; margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */ padding: 0; text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */ color: #000000; background-image: url(images/nav/blue/blue.bg.png); background-repeat: repeat; background-color: #009; } .oneColFixCtr #container { width: 1000px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */ background: #FFFFFF; margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */ padding: inherit border: 0px solid #000000; text-align: left; /* this overrides the text-align: center on the body element. */ padding: 0px; border: 0px; } .oneColFixCtr #mainContent { padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */ } body, td, th { color: #333; } a img { border:none; padding:0; margin:0; float:left; } a:link { color: #009; text-decoration: none; } a:visited { text-decoration: none; color: #000053; } a:hover { text-decoration: underline; color: #009; } a:active { text-decoration: none; color: #009; } --> </style> and the <img src=" ... "> code: Code: <!-- MAIN NAVIGATION BANNER --> <!--HOME--> <a href="index.php"><img src="images/nav/blue/home_select.png" alt="home" name="home" width="82" height="30" border="0" id="home" onmouseover="document.images.home.src='images/nav/blue/home_over.png'" onmouseout ="document.images.home.src='images/nav/blue/home_select.png'"/></a> <!--PROGRAMS--> <a href="programs.php"><img src="images/nav/blue/programs.png" alt="programs" name="programs" width="111" height="30" border="0" id="programs" onmouseover="document.images.programs.src='images/nav/blue/programs_over.png'" onmouseout ="document.images.programs.src='images/nav/blue/programs.png'"/></a> <!--SCHEDULE OF EVENTS--> <a href="schedule.php"><img src="images/nav/blue/scheduleofevents.png" alt="schedule of events" name="scheduleofevents" width="189" height="30" border="0" id="scheduleofevents" onmouseover="document.images.scheduleofevents.src='images/nav/blue/scheduleofevents_over.png'" onmouseout ="document.images.scheduleofevents.src='images/nav/blue/scheduleofevents.png'"/></a> <!--CONTACT US--> <a href="contact.php"><img src="images/nav/blue/contactus.png" alt="contact us" name="contactus" width="119" height="30" border="0" id="contactus" onmouseover="document.images.contactus.src='images/nav/blue/contactus_over.png'" onmouseout ="document.images.contactus.src='images/nav/blue/contactus.png'"/></a> <!--DOWNLOADS--> <a href="downloads.php"><img src="images/nav/blue/downloads.png" alt="downloads" name="downloads" width="267" height="30" border="0" id="downloads" onmouseover="document.images.downloads.src='images/nav/blue/downloads_over.png'" onmouseout ="document.images.downloads.src='images/nav/blue/downloads.png'"/></a> <!--FACEBOOK--> <a href="javascript:void(0)" onclick="window.open('http://www.facebook.com/pages/Delhi-NY/Delaware-County-Public-Health-Nursing-Service/247460644781?ref=ts')"><img src="images/nav/blue/facebook.png" alt="facebook" name="facebook" width="90" height="30" border="0" id="facebook" onmouseover="document.images.facebook.src='images/nav/blue/facebook_over.png'" onmouseout ="document.images.facebook.src='images/nav/blue/facebook.png'"/></a> <!--TWITTER--> <a href="javascript:void(0)" onclick="window.open('http://www.twitter.com/dcphns')"><img src="images/nav/blue/twitter.png" alt="twitter" name="twitter" width="67" height="30" border="0" id="twitter" onmouseover="document.images.twitter.src='images/nav/blue/twitter_over.png'" onmouseout ="document.images.twitter.src='images/nav/blue/twitter.png'"/></a> <!--BLOGGER--> <a href="javascript:void(0)" onclick="window.open('http://dcph.blogspot.com')"><img src="images/nav/blue/blogger.png" alt="blog" name="blogger" width="75" height="30" border="0" id="blogger" onmouseover="document.images.blogger.src='images/nav/blue/blogger_over.png'" onmouseout ="document.images.blogger.src='images/nav/blue/blogger.png'"/></a> I know it's a bit of a mess.. but regardless, I cannot figure out why this happens.. any ideas? Hi, Glad I found this website. I'm a novice at html. I've been reading through some unrelated posts and learned a few new things already! I am helping someone build her website (learning along the way) and ran into a display problem in Mozilla that did not with I.E. After spending many hours helping my friend with a website and learning along the way, to my horror, I find that one of the frames do not display with Mozilla. I tried looking online to solve the problem but can't find anything with the same error. I'm hoping someone can help me ... please :-) I temporarily posted the website files at http://home.comcast.net/~test_pearlyeemd/ As you can see, the left frame does not display in Mozilla, but does in I.E. I suspect it's a compatibility issue but am not sure. Then I poked around in the Mozilla browser's Tool | Error Console and it gave me an error "document.layers is undefined" ... I have no idea what this means. I really don't want to start from scratch as I've already invested so much time into what I already did. Any help/suggestions would be greatly appreciated! Thanks! Hello. I own a website called The Dakini Hut (located at http://populous.strategyplanet.games.../thedakinihut/). I'm having problems with my site, though. You see, I recently updated the layout and its really screwing up, but one of the major problems I'm having is that the whole page won't show. The navigation bar cuts off halfway and you can't see all of the pages/links. This only happens on pages where the navigation bar goes down further than the other tables. Can anyone help me fix this? By the way, it works fine in Firefox and Opera, just not in IE. Ok so i have this webpage designed, have a bunch of images/shortcuts in a big table. When i view it in google chrome, it looks like its supposed to, no border around frames. EXAMPLE CLICK HE http://www.pictrace.com/i/wtfborders2.gif When i view it in IE and FF, the tables have red borders, how would i disable that? EXAMPLE CLICK HE http://www.pictrace.com/i/wtfborders1.gif View the source code here http://www.jasonparkerracecars.com/bikes/ Any advice is appreciated. Hi, I know how to include default text in a text area box, but is it possible for it to show a .txt file on the server, would the page need to be php for this? thanks Cant understand why the HTML code is showing on my webpage http://www.mcaorals.co.uk/Fraserburgh%20History.htm also I've another problem, I've checked the coding in W3 http://validator.w3.org/ and I have no errors, but I cant understand why this webpage is getting very little hits, I'm usual around 60 - 65 place with the keyword "Fraserburgh" any help would be grateful thanks in advance Navteacher This image only shows when the doctype is NOT declared, and I can't figure out why. Code: <img src="images/logo.jpg" alt="" /> And here is my doctype: 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"> I ran the page through the W3C validator and there's no errors.... I'm pulling my hair out because I don't understand why an image would disappear when the doctype is removed. Anybody know why? Hi Everyone, i have a peculiar problem with IE6. The header on of the site I am working on right now (http://www.mobilitynow.de) is a DIV Container in which I am loading several PNG images (without transparency). They have a Java script rollover effect. In IE6 (not in any Firefox, Opera or higher Version of IE) the BG where the images are to be placed is shown red while the loading of the images is in progress. Anyone has an idea what the problem might be. Suggestions would be really appreciated. Thanks a lot, Jonathan Hi guys, im a secretary in an office and my boss asked me to edit his website. He had some1 create it for him, and he doesnt know how to fix a certain problem. Basically, everytime we search for the site "Property in Negril For Sale" The site (www.NegrilProperty4Sale.com) in google, the title just comes up as index. Someone told me its an html problem. Im in Yahoo Web right now looking at 3 different HTML files, and I don't know what to do. Hi Folks, Newbie to this forum so looking for somebody's HTML eyes to see where the problem is. I have a simple flash header above my main content body but for some reason it shows a space below it which is viewed only in Firefox. I've tried using a div instead of a table but the space is still there I also used an image instead of the swf file and there isn't any space..displays perfectly. I've used different swf files and all each shows that space. Works fine in IE. Can somebody see the problem, would be very grateful? <tbody> <div id="header"> <object classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="766" height="189"> <param name="movie" value="header.swf" /> <param name="quality" value="high" /> <embed src="header.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="766" height="189"></embed> </object> </div> </table> Hi Guys, I'm trying to put together a simple feedback form floating on top of my background image. However the form shows up with scroll bars on right side and bottom of the form. I've no idea why. How can I get it to just show up as normal without the scroll option? Thanks guys! HTML Code: <style type="text/css"> #main { width:689px; margin:auto; font-family:verdana,sans-serif; font-size:12px; } #header { height:600px; width:700px; background-image:url(http://i827.photobucket.com/albums/zz193/colinbrady1985/CLUB/ClubApp02. jpg); } #header a { float:left; width:140px; height:115px; text-indent:-9999px; } #header div { float:left; width:360px; height:107px; padding:10px; color:#fff; overflow:auto; } img { display:block; border:0; } form { width:517px; padding-top:10px; margin:0; background-color:#01abe8; } form p { padding:0 5px; font-size:11px; color:#fff; text-align:center; } form div { padding-bottom:10px; } form label { float:left; width:146px; padding-left:5px; color:#fff; } form .required{ font-size: 13px; color:#f00; } form .btn { margin-left:153px; } form .btn1 { margin-left:150px; } </style> <div id="main"> <div id="header"> <a href="">albums</a> <div id="text"><font size="4" face="Arial"> <div> <div style=" top:245px; left:45px;"> <form method="post" action="sendmail.php"> Email: <input name="email" type="text" /><br /> Message:<br /> <textarea name="message" rows="8" cols="20"> </textarea><br /> <input type="submit" /> </form> </div> </div> </div> </div> Hello all- This is my first post on HTML forums, and I hope ya'll can help me out with this issue. I feel really dumb...and think that my problem is probably a simple one, but I can't figure it out. I've got a left sidebar, coded to float left in CSS, and in dreamweaver it shows up appropriately. However, whenever I look on firefox or ie, the left shows up on the right. I've also got an orange background image that DOES show up in the correct spot. I'm wondering if my problem could be related to the fact I've got the image listed under main-content, not the left sidebar. I've moved that line in the CSS, but it didn't help. Here is a link to my problem: http://www.durhamsafekids.org/main.html Here is my CSS code: Code: body { font-size: 62.5%; background: url(images/top-bdr.jpg) repeat; } p, li { font: 1.2em/1.8em Sabon, sans-serif; margin-bottom: 10px; } h1 { font: 2.0em "Helvetica Neue", sans-serif; color: white; height: 0px; } h2 { font: 1.8em "Helvetica Neue", sans-serif; color: #99cc33; margin-bottom: 10px; } h4 { font :Georgia, "Times New Roman", Times, serif; color: #0078AA; } h3 { font :Georgia, "Times New Roman", Times, serif; color: #333399; } ul { margin-left: 25px; } img { border: none; } #page-wrap { background: white; width: 960px; margin: 10px auto; } #page-wrap #inside { margin: 10px 10px 0px 10px; padding-top: 10px; padding-bottom: 10px; } #main-content { background: url(/images/left-sidebar.gif) repeat-y white; padding-left: 230px; padding-top: 20px; } #header { background: #ffffff; text-align: center; } #menu { background: #ffffff; } #left-sidebar { width: 185px; float: left; padding-left: 15px; padding-top: 20px; } #footer { background: #99cc33; text-align: center; padding-top: 20px; padding-bottom: 20px; color: #006699; font-size: 12px; } .footer a:link { /* Applies to unvisited links in class mainNav */ text-decoration: none; font-weight: bold; color: #006699; } .footer a:visited { /* Applies to visited links in class mainNav */ text-decoration: none; font-weight: bold; color: #006699; } .footer a:hover { /* Applies to links under the pointer in class mainNav */ text-decoration: underline; font-weight: bold; color: #006699; } /* ================================================================ This copyright notice must be kept untouched in the stylesheet at all times. The original version of this stylesheet and the associated (x)html is available at http://www.stunicholls.com/menu/pro_drop_2.html Copyright (c) 2005-2007 Stu Nicholls. All rights reserved. This stylesheet and the associated (x)html may be modified in any way to fit your requirements. =================================================================== */ .preload1 {background: url(menu/three_1.gif);} .preload2 {background: url(menu/three_1a.gif);} #nav {padding-left:217px; margin:0; list-style:none; height:38px; background:#fff url(menu/three_0.gif) repeat-x; position:relative; z-index:500; font-family:arial, verdana, sans-serif;} #nav li.top {display:block; float:left; height:38px;} #nav li a.top_link {display:block; float:left; height:35px; line-height:33px; color:#ccc; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 12px; cursor:pointer;background: url(menu/three_0.gif);} #nav li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:35px; background: url(menu/three_0.gif) right top no-repeat;} #nav li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:35px; background: url(menu/three_0a.gif) no-repeat right top;} #nav li:hover a.top_link {color:#fff; background: url(menu/three_1.gif) no-repeat;} #nav li:hover a.top_link span {background:url(menu/three_1.gif) no-repeat right top;} #nav li:hover a.top_link span.down {background:url(menu/three_1a.gif) no-repeat right top;} /* Default list styling */ #nav li:hover {position:relative; z-index:200;} #nav li:hover ul.sub {left:1px; top:38px; background: #bbd37e; padding:3px; border:1px solid #5c731e; white-space:nowrap; width:110px; height:auto; z-index:300;} #nav li:hover ul.sub li {display:block; height:20px; position:relative; float:left; width:110px; font-weight:normal;} #nav li:hover ul.sub li a {display:block; font-size:11px; height:18px; width:108px; line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #bbd37e;} #nav li ul.sub li a.fly {background:#bbd37e url(menu/arrow.gif) 100px 6px no-repeat;} #nav li:hover ul.sub li a:hover {background:#6a812c; color:#fff; border-color:#fff;} #nav li:hover ul.sub li a.fly:hover {background:#6a812c url(menu/arrow_over.gif) 100px 6px no-repeat; color:#fff;} #nav li:hover li:hover ul, #nav li:hover li:hover li:hover ul, #nav li:hover li:hover li:hover li:hover ul, #nav li:hover li:hover li:hover li:hover li:hover ul {left:110px; top:-4px; background: #bbd37e; padding:3px; border:1px solid #5c731e; white-space:nowrap; width:110px; z-index:400; height:auto;} #nav ul, #nav li:hover ul ul, #nav li:hover li:hover ul ul, #nav li:hover li:hover li:hover ul ul, #nav li:hover li:hover li:hover li:hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;} #nav li:hover li:hover a.fly, #nav li:hover li:hover li:hover a.fly, #nav li:hover li:hover li:hover li:hover a.fly, #nav li:hover li:hover li:hover li:hover li:hover a.fly {background:#6a812c url(menu/arrow_over.gif) 110px 6px no-repeat; color:#fff; border-color:#fff;} #nav li:hover li:hover li a.fly, #nav li:hover li:hover li:hover li a.fly, #nav li:hover li:hover li:hover li:hover li a.fly {background:#bbd37e url(menu/arrow.gif) 110px 6px no-repeat; color:#000; border-color:#bbd37e;} And here is my HTML code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html" /> <title>Durham County Safe Kids</title> <link rel="stylesheet" type="text/css" href="style.css" /> <!--[if lt IE 7]> <link rel="stylesheet" type="text/css" href="style-ie.css" /> <![endif]--> </head> <body> <div id="page-wrap"> <div id="inside"> <div id="header"><!-- #BeginLibraryItem "/library/header.lbi" --><img src="images/Header2.jpg" alt="Durham County Safe Kids" name="headerimage" width="775" height="200" border="1" style="background-color: #CCCCCC"> <!-- #EndLibraryItem --></div> <div id="menu"><!-- #BeginLibraryItem "/library/menu.lbi" --> <span class="preload1"></span> <span class="preload2"></span> <ul id="nav"> <li class="top"><a href="library/index.html" class="top_link"><span>Home</span></a></li> <li class="top"><a href="#nogo2" id="safety" class="top_link"><span class="down">Safety</span></a> <ul class="sub"> <li><a href="#nogo3" class="fly">Vehicle Safety</a><ul> <li><a href="#nogo4">Car Seats</a></li> <li><a href="#nogo5">Spot the Tot</a></li> <li><a href="#nogo6">Hyperthermia</a></li> <li><a href="#nogo7">Distracted Driving</a></li> </ul> </li> <li><a href="#nogo8">Poison Prevention</a></li> <li><a href="#nogo9">Wheeled Safety</a></li> <li><a href="#nogo10">Firearms Safety</a></li> <li><a href="#nogo11">Water Safety</a></li> <li><a href="#nogo12">Home Safety</a></li> <li><a href="#nogo13">Pedestrian Safety</a></li> </ul> </li> <li class="top"><a href="#nogo54" id="events" class="top_link"><span>Events</span></a></li> <li class="top"><a href="#nogo55" id="links" class="top_link"><span>Links</span></a></li> <li class="top"><a href="#nogo56" id="photos" class="top_link"><span>Photos</span></a></li> <li class="top"><a href="#nogo57" id="about" class="top_link"><span>About Us</span></a></li> </ul> <!-- #EndLibraryItem --></div> <div id="left-sidebar">This Text should be in the Orange Left Sidebar.</div> <div id="main-content"><img src="images/preventingunintentionalinjury.gif" alt="" width="529" height="127" align="right" /><br /><br /> <h2>This website is currently under construction. Please come back soon!</h2> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> </div> <div style="clear: both;"></div><!-- #BeginLibraryItem "/Library/footer.lbi" --> <div id="footer"> <table align="center" width="50%" border="0" cellspacing="1" cellpadding="1"> <tr> <th scope="col"><span class="footer"><a href="index.html">Home</a></span></th> <th scope="col"><span class="footer"><a href="#">Safety</a></span></th> <th scope="col"><span class="footer"><a href="#">Messages</a></span></th> <th scope="col"><span class="footer"><a href="#">Links</a></span></th> <th scope="col"><span class="footer"><a href="#">Photos</a></span></th> <th scope="col"><span class="footer"><a href="#">About Us</a></span></th> </tr> </table> <br> <center><font size="+2" color="FFFFFF"><strong>Durham County Safe Kids</strong></font></center> </div><!-- #EndLibraryItem --></div> <div style="clear: both;"></div> </div> </body> </html> As you can see from the linked screenshot, the text shows up on the right side of the page, not in the orange box. http://www.durhamsafekids.org/dskscreen.jpg Thanks all! ~Jeff Hi guys, new poster here. I just used Filezilla to change the index.html file of a website. What I did is paste my html into the document in textedit, saved it as html, then used filezilla to overwrite to old file in the site's directory. Now when I go to the site's index page, all I see is the markup from the file that I updated with. Why isn't it showing my design? Thanks a lot. I'm using tables and I have text inside one table. When I add line height to text so it looks good in IE6, Safari and Google Chrome, it looks wrong in FireFox and Opera. Every line is over each other. How could I fix this? Here is the code from start to end of the text part: Code: <html> <head> <link rel="stylesheet" type="text/css" href="style.css" /> <title>my site</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- body { background-image:url('tausta.jpg'); background-repeat:no-repeat; background-attachment:fixed; background-position:center; } .style1 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #FFFFFF; line-height: 5%; } .style2 {color: # color: #999999; color: #999999; } .style4 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #999999; line-height: 5%; } .style5 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #999999; line-height: 5%; font-weight: bold; } --> </style></head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <div class="page"> <table id="Table_01" width="912" height="543" border="0" cellpadding="0" cellspacing="0"> <tr> <td rowspan="14" width="176" height="542" valign="top"><div align="right" class="style1"> <p class="style2"> </p> <p class="style2"><strong><u>FILES:</u> </strong><u><br> </u><br> <br> <br> <br> </p> </div> <p align="right" class="style5">Images: </p> <p align="right" class="style4">images1 <br> <br> <br> <br> </p> <p align="right" class="style5">Videos: </p> <p align="right" class="style4">video1 </p> <p align="right" class="style4">video2 </p> <p align="right" class="style4">video3 </p> <p align="right" class="style1"><span class="style2">1 - video4 </span></p></td> I'm having trouble with a header in IE. I'm a beginner but modifying a webpage. I have a header that when opened in Firefox or Chrome stretches normally across a page, e.g. "This is the header" However, when I open the same page in IE, I'm getting one word per line, e.g. "This is the header" Does anyone know how to resolve this please? I'd be very grateful for any help Hi guys and girls out there on the forum My website has a problem with showing properly in Firefox Here is my url: http://lessons-4-success.com Can you tell me what i can do to get it to show properly like it do in IE ? Thanks much in advance for answers.. Michael Basically, I am using a site that only allows its members to add basic HTML (not scripts or JS or CSS) in its layout. I have done a lot of stuff already, but I have a question if what I want to do in the diagram below is possible just with HTML. It is basically pretty simple, except that I can't seem to get the code to work to make only part of a page (specified area/rectangle) a certain background color or image and then still be able to embed a couple image URL's (buttons) on top of it, as well as formatted text I choose. Does it have something to do with using <div> code? If I can get the images (as buttons) mounted against that area/rectangle, I'm pretty sure I know how to make them hot links to another site. However, the final kicker is I want the buttons to be a default image normally, but then switch to another image of the same size when someone mouses over it, and that when clicked is also the hot link to the URL . That is the part I know little about. Is anyone here genius enough to just look at my diagram and write me the code, and just substitute generic values for where I'd put the specific image URL's, text formatting and parameters I specify? I hope this diagram helps, thanks a lot to anyone who can do this for me!!! |