HTML - Ie Code Problem - Cannot Explain Weird Behavior [pics Included]
THIS PROBLEM IS WITH --IE-- ONLY
I have this piece of code that I simplified as much as I could to show a simple example: PHP Code: <table width="50%"> <tr><td colspan="2">short</td></tr> <tr> <td width="128"><img src="" width="110"></td> <td>a<br>a<br>a</td> </tr> </table> <table width="50%"> <tr><td colspan="2">long long long long long long long</td></tr> <tr> <td width="128"><img src="" width="110"></td> <td>a<br>a<br>a</td> </tr> </table> For some reason when long-long-long text is long enough, it pushes a-a-a-a to the right even through one of the cells is limited to 128 pixels.. If I color the backgrounds of the cells in different colors, it is evident that it is the cell pushing, not text-alignment problem Question, why the cell is affected but the upper cell text length even through it is properly col-spanned..? Similar TutorialsI've created a table using xhtml similar to the following: <table> <caption></catpion> <thead></thead> <tbody></tbody> <tfoot></tfoot> </table> For some reason, when I set the caption height > 30px the caption section starts repeating itself but not with the caption text. Here's a pic: http://instagr.am/p/IM55OpPYn5/ I get this behavior in both IE and FF. Is this the expected behavior? Is there a workaround for this? It seems like xhtml would provide more flexibility than this.... Hi guys, this is the site: http://eksow.com/ This the the source code for it: Quote: <html> <head> <title>Eksow Event Design & Management</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <SCRIPT TYPE="text/javascript"> <!-- // copyright 1999 Idocs, Inc. http://www.idocs.com/tags/ // Distribute this script freely, but please keep this // notice with the code. var rollOverArr=new Array(); function setrollover(OverImgSrc,pageImageName) { if (! document.images)return; if (pageImageName == null) pageImageName = document.images[document.images.length-1].name; rollOverArr[pageImageName]=new Object; rollOverArr[pageImageName].overImg = new Image; rollOverArr[pageImageName].overImg.src=OverImgSrc; } function rollover(pageImageName) { if (! document.images)return; if (! rollOverArr[pageImageName])return; if (! rollOverArr[pageImageName].outImg) { rollOverArr[pageImageName].outImg = new Image; rollOverArr[pageImageName].outImg.src = document.images[pageImageName].src; } document.images[pageImageName].src=rollOverArr[pageImageName].overImg.src; } function rollout(pageImageName) { if (! document.images)return; if (! rollOverArr[pageImageName])return; document.images[pageImageName].src=rollOverArr[pageImageName].outImg.src; } //--> </SCRIPT> <!-- ImageReady Slices (Untitled-1 copy.psd) --> <Center> <table id="Table_01" width="1024" height="769" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="6"> <img src="images/Eksow_01.jpg" width="1024" height="261" alt=""></td> </tr> <tr> <td rowspan="4"> <img src="images/Eksow_02.jpg" width="65" height="507" alt=""></td> <td> <A HREF="#" onMouseOver = "rollover('left')" onMouseOut = "rollout('left')" ><IMG SRC="http://eksow.com/images/Eksow_03.jpg" NAME="left" ALT="Home Page" BORDER=0 ></A> <SCRIPT TYPE="text/javascript"> <!-- setrollover("http://eksow.com/images/Rollover_1_03.jpg"); //--> </SCRIPT> </td> <td colspan="2"> <A HREF="#" onMouseOver = "rollover('middle')" onMouseOut = "rollout('middle')" ><IMG SRC="http://eksow.com/images/Eksow_04.jpg" NAME="middle" ALT="Home Page" BORDER=0 ></A> <SCRIPT TYPE="text/javascript"> <!-- setrollover("http://eksow.com/images/Rollover_2_04.jpg"); //--> </SCRIPT></td> <td> <A HREF="#" onMouseOver = "rollover('right')" onMouseOut = "rollout('right')" ><IMG SRC="http://eksow.com/images/Eksow_05.jpg" NAME="right" ALT="Home Page" BORDER=0 ></A> <SCRIPT TYPE="text/javascript"> <!-- setrollover("http://eksow.com/images/Rollover_3_05.jpg"); //--> </SCRIPT></td> <td rowspan="2"> <img src="images/Eksow_06.jpg" width="78" height="491" alt=""></td> </tr> <tr> <td colspan="4"> <img src="images/Eksow_07.jpg" width="881" height="262" alt=""></td> </tr> <tr> <td colspan="5"> <A HREF="#" onMouseOver = "rollover('bottom')" onMouseOut = "rollout('bottom')" ><IMG SRC="http://eksow.com/images/Eksow_08.jpg" NAME="bottom" ALT="Home Page" BORDER=0 ></A> <SCRIPT TYPE="text/javascript"> <!-- setrollover("http://eksow.com/images/Rollover_4_08.jpg"); //--> </SCRIPT></td> </tr> <tr> <td colspan="2"> <img src="images/Eksow_09.jpg" width="567" height="8" alt=""></td> <td> <img src="images/Eksow_10.jpg" width="21" height="8" alt=""></td> <td colspan="2"> <img src="images/Eksow_11.jpg" width="371" height="8" alt=""></td> </tr> <tr> <td> <img src="images/spacer.gif" width="65" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="292" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="275" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="21" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="293" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="78" height="1" alt=""></td> </tr> </table> </center> <!-- End ImageReady Slices --> </body> </html> Here is what I'm trying to accomplish, but have no idea where to start from... 1. When people go to the site, the pictures at the bottom don't appear 2. When people click on "Hospitality Night" (far left), then the pictures appear 3. When it's clicked, the rollover image stays (white box) So in laymans terms... I go to the site, I click on far left link, pictures show. I click on the middle link, diff pictures show i click on the right one, different pictures show. && done I'm having a problem trying to anchor this Javascript menu into a fixed position. Heres the website http://www.intuition-designs.com/test1.htm as you might recognize, I'm trying to mimic the Facebook application bar that runs along the bottom of their website I'd like to have the menu anchored to the navbar at the bottom, so when I scroll, the menu will not scroll. I have a separate Javascript file for the menu Here is the HTML for the website so far. ANY HELP IS GREATLY APPRECIATED!!: 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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> html, body { height:100%; } html.use_scroll_wrapper { overflow:hidden; } #bottom_bar { position:fixed; bottom:0; left: 15px; right: 15px; height: 27px; background:url(http://www.intuition-designs.com/images/midbottom.png) repeat top left; z-index: 3; color: #FFF; text-align: right; } #bottom_bar table tr th { text-align: right; } .gg { text-align: right; } .xx { text-align: left; } </style> </head> <body> <script type="text/javascript">var MenuLinkedBy="AllWebMenus [4]",awmMenuName="navbar",awmBN="766";awmAltUrl="";</script><script charset="UTF-8" src="navbar.js" type="text/javascript"></script><script type="text/javascript">awmBuildMenu();</script> <div id="bottom_bar"> <table width="50" border="0" align="left" cellpadding="0" cellspacing="0" id="awmAnchor-navbar"> <tr> <th scope="col"> </th> </tr> </table> </div> </body> </html> I am working on an index page with menu for a friend and originally did the page an menu separately....I was able to get them to work together but when i do the In-Dreamweaver preview does not work...This is very important because she will need the preview to make her changes... Everything looks fine upon viewing in browser but no preview.... I think it probably has something to do with me using two different body tages with two different csses....Can somebody take a look and see if they can find my problem? Any help would be greatly appreciated! You can view an online version at: http://www.firstpresgreenville.org/NEWFPATEST/menu.html Hey i recently opened a blogged and wanted to begin customizing it with shoutboxs , games, etc Blog is runned by Mac OSx , it allows u to post html as well, but 98% of the html codes i put in there doesnt work...the ones that do work , well they seem to have <table> inserted in them...and strangly one of my posting options is to insert a table, so when i click on that *insert table* i paste my html code(shoutbox) and click insert (for table) and all the codes seem to work fine and shoutbox looks great, until i cllick the <>(htmlm mod) everything seems to go back to where it was before i started testing with table (which is that it doesnt work), this is only if switch from normal to html and back after i insert html codes through table...but if i just paste the Html codes for the shoutbox into *HTML* section, it shows up as the link that i use to gernate these codes...this happens with every one of my html codes including the ones that do work for the blog and dont work for the blog....So im stuck with HTML codes that only show up when the *insert table dialog box pops up and i insert html from there to blog.(which cancels html codes in the end)..From the table with the successful HTML, if i click Save,HTML mode, or Preview, it just makes the codes void..I think that when iclick any of those commands, the blog messes with codes Does anyone know any great codes to bypass w/e the blog is doing to my codes or simulating the table forever with the codes? TY Friend said that blog has ScriptTags, and by using table i can bypass that...Unfortunatly ive tried inserting <table> and </table> around it...nothing works.. heres an example of one of the few that does work for the blog(had table tags when i copied it from generator): <div class="wiki_entry"> <div> <div> <div><br /></div> <table><tbody> <tr> <td><a href="http://www.website-hit-counters.com"><img src="http://www.website-hit-counters.com/cgi-bin/image.pl?URL=109386-8813" alt="www.website-hit-counters.com" /></a></td> </tr> <tr> <td><a href="http://www.website-hit-counters.com/search-engine-optimization.html" title="search engine optimization firm">This many People saw this</a></td> </tr></tbody> </table></div><br /></div></div> HEre is one that doesnt(after i placed tables around it myself) <div class="wiki_entry"> <div> <div> <div><br /></div> <table><tbody> <tr> <!-- Begin ShoutMix - http://www.shoutmix.com --> <iframe title="jimbaler" src="http://www.shoutmix.com/?jimbaler" width="100" height="130" frameborder="0" scrolling="auto"> <a href="http://www.shoutmix.com/?jimbaler">View shoutbox</a> </iframe> <br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br /> <!-- End ShoutMix --> </tr> </tbody> </table></div><br /></div></div> Can someone please check my site in IE6? I think the text in the navigation menu on the left doesn't shows up besides "Pictures"... I saw this problem on my client's computer (yikes! ). It was really weird, the boxes were just green with no writing until you hovered over them. I don't have access to 6 myself and I'd really really appreciate it if someone could check this: http://www.salemnhconservation.org Let me know if this problem happens with you! Thanks!!! Here is my CSS: Code: #awardcontainer { width: 700px; margin-top: 20px; margin: auto; padding: 0; } #blueheader { background: url('http://www.forumbuff.com/fpacolor1top.png') no-repeat; width: 700px; height: 50px; margin: 0; padding: 5px; } #bluecontent { background: yellow; max-width: 700px; margin: 0; padding: 2; } #bluefooter { background: url('http://www.forumbuff.com/fpacolor1bottom.png') no-repeat; width: 700px; height: 50px; margin: 0; padding: 5px; float: left; } Here is my HTML: HTML Code: <html> <head> <title>Test</title> <link href="stylesheet.css" rel="stylesheet" type="text/css"> </head> <body> <div id="awardcontainer"> <div id="blueheader"> </div> <div id="bluecontent"> Testing 1 2 3 </div> <div id="bluefooter"> </div> </div> </body> </html> The error can be found at: http://zenrer.com/fptest/awards.html I have never seen this problem before, the gap between the header and the content. Can someone help me please. Hi I've got a weird problem. Basically, I've created an effect where an image (designed to look like the front of a record sleeve) flips when clicked, and then shows a different image (which looks like the reverse of the same sleeve). There are nine "albums" on the page, however, the effect only works on one image at any one time (by default "album1", but delete this album and the effect will work exclusively on "album2" and so on). Changing "div id" to "div class" throughout the HTML document, style sheet etc. doesn't help, it only rearranges the images. I've pasted the relevant code below. I can't understand the problem, and it's creating a serious roadblock. Any ideas? Thanks - Chris HTML: <!-- Album pictures (front sleeve on left, zig-zag sleeve reverse on right) --> <div id="album1"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album1.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Reverse.png" </div> <div id="album2"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album2.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Reverse.png" </div> <div id="album3"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album3.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Reverse.png" </div> <div id="album5"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album5.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Album2.png" </div> <div id="album6"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album6.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Album2.png" </div> <div id="album7"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album7.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Album2.png" </div> <div id="album9"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album9.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Album2.png" </div> <div id="album10"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album10.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Album2.png" </div> <div id="album11"> <a class="opacity"/> <img id="flip1" img src="Top_16/Album11.png" /> <!-- Flip --> <img id="flip2" img src="Top_16/Album2.png" </div> CSS: /* Image flip code (applies to album divs, decreases then increases width and opacity, hiding one image then the other, producing a "flipping" optical illusion) */ #flip1{ position:absolute; cursor:pointer; width:104px; height:104px; } #flip2{ display:none; position:absolute; cursor:pointer; } I am just about to ship this template off to a customer but I am having a problem with my footer. The footer is supposed to expand the width of the page at the very bottom of the page. However, the footer is cramming itself in below the content on the right side panel. However, if I add 2 </div> tags in the HTML code directly above the footer code than it works perfect. The problem is that this invalidates the code and I can't figure out why. The validator claims these </div> tags aren't matched with enough <div> tags. Im going nuts and I know this is a really simple issue. Can anybody see what is going on?! Here is the page I am talking about: http://current-post.com/refractive/inner.html website- http://webtvdeluxe.com/home.php It's not really a problem but an annoyance. I just set up my page so it is html 4.0.1 strict. I don't have any errors or anything. Everything is viewed perfectly on a windows computer(no matter what the browser as far as I can tell). However on a mac I get this problem.... If you have a mac, use safari or firefox to view the page. At first glance, you will say "Well what's the problem?" The bottom of the middle table below fashion expert should be the bottom of the page. However the page continues further down alittle bit. If I didn't have those tables in the middle filling that empty space, the page would still be that long. For example, on one of my pages, I only have one table in the middle but my page still scrolls down right to that spot. Even if there is no content to push the table down that far which is the weird part. Has anyone ever encountered this? Is this possibly a bug with mac browsers? Is there maybe a fix? Hello, I've got a weird problem that I've never come across before... I've created a page with a hidden div on it that is displayed at certain times (after a button is clicked). The div is displayed on top of a semi opaque div that covers the whole of the page (this is created and added to the page when the hidden div is shown). The effect is very similar to the lightbox technique. To prevent select boxes showing through the opaque overlay in IE6 I'm also using an iframe shim. The only problem I have is that in FireFox, the text input fields on my lightbox div do not have the flashing carat in them. You can select the inputs and enter text into them, it just looks a little odd not having a carat in them when they are selected. Anyone else come accross this? Hey, I've just recently up-loaded a new site i have put together, and i'm having a wierd problem with some of the images on the site. Whats happening is that when i view my site, some of the images don't appear, i just get the right hand corner red cross box. And a friend of mine who viewed the site had exactly the same problems, with exactly the same images. But two other people who viewed the site had no problems with any of the images not showing! The other wierd thing, is that i will have an image which works on one page, but then won't work on another page, even though it's exactly the same image file. This is only the case for one image which i'm aware of, all the other images which aren't working are consitant throughout all pages. I have contacted my hosting company and they have mentioned it's most likely something to do with my site coding. I don't understand what i could have done to have made this happen though. If one image works, the others should too... or so i would have presumed. All my images are in the same image folder and they are all either jpg or gif files. My website is feedthefitness.com i hope it's ok i mention it on this forum. I think it would be good to be able to have a look at the site to see what i'm talking about. Any ideas of what could be the problem would be greatly appreciated. I've tried up-loading my site a few times and it's made no difference. Thanks in advance. After fixing the code for my image maps after my question yesterday, I got an email from a user saying this: "I just noticed one thing when viewing the site using IE. on the pages, IE is shrinking the image and rather than giving me the option to click on a link, it gives me a magnifying glass to enlarge the image. When i enlarge the image, I still can't click on the links. Instead I get the magnifying glass to shrink the image back down." Here is an example of the code: <img src="About.jpg" width="1100" height="825" border="0" usemap="#about" /> <map name="about" /> <area shape="rect" coords="285,29,316,50" href="http://www.com" title="HOME" alt="Home" /> <area shape="rect" coords="383,29,460,50" href="http://www.com/teachers" title="FOR TEACHERS" alt="For Teachers" /> <area shape="rect" coords="469,29,516,50" href="http://www.com/support" title="SUPPORT" alt="Support" /> </map> It works fine with Safari and Firefox. What could be causing that problem with IE? Wzup Got a little issue on my site. is showing everything great in firefox. IE is a little off but i'm still working on that. but in safari i doesn't show anything. This is the site try it out. click on the Events button in the nav bar. in FFX my stuff shows up safari it doesn't i used div tags to show it and css sheets site created in dreamweaver. checked with w3 validator thanks for any help greetz robin Hi Guys, This is my first post on this forum. Basically, Ive agreed to turn someone website, into a joomla template, and then format articles and such until it looks exactly like the original site. This would give them the ability to add their own content without my help(I offered to redo the site, but they like their current one even though its quite bad). All was going well, and I sent out an email to check the progress of the site to the client, and he replied to me that the site was all distorted in Safari. Being a windows programmer, I was used to IE/firefox, Safari and the other browsers never really crossed my mind. Anyway, I downloaded safari, chrome and opera, and tested the sites out. Opera they were fine, but chrome and Safari, some things align WAYYY to the left, almost off screen. I'm guessing it may be a CSS issue, but Ive checked, rechecked, deleted, restored almost everything and its still messed up in those browsers! This is a paying client, so I need to get this sorted out as soon as possible. The pages in question are he http://www.longboardcapital.net/inde......7&Itemid=27 http://www.longboardcapital.net/inde......48&Itemid=2 Ive paused on content creation, as this is a big problem. Have any of you ever experienced the same or similar problem? can you all offer any suggestions? Thank you so much for your help, -Tim Ok look at these two links. Here everything lines up: http://www.hfhpulm.com/schedules/staffcallnext.php however here the date does not line up in the table: http://www.hfhpulm.com/schedules/staffcallcurrent.php Now the WEIRD thing is that the two codes are EXACTLY the same except: link 1: Code: <?php $next_month= date("F", strtotime("+1 month")); $curr_month = date ('F'); $consultsq1 = "SELECT * FROM `staffsched` WHERE `which_month`='".$next_month."'"; link 2 (the one that doesn't line up): Code: $next_month= date("F", strtotime("+1 month")); $curr_month = date ('F'); $consultsq1 = "SELECT * FROM `staffsched` WHERE `which_month`='".$curr_month."'"; Why would changing to the current month (which also happens to be the value on the database) make the lines not match up? Hello, I have a problem this code has a problem. The first paragraph's email code doesnt show correctly. It seems to extend past the </a> to the next one it is very weird. Code: <html> <head> <!-- New Perspectives on HTML and XHTML Tutorial 2 Case Problem 3 Diamond Health Club Membership Options Author: Dustin Williams Date: March 9, 2011 Filename: members.htm Supporting files: diamond.jpg --> <title>Diamond Health Club Membership</title> </head> <body> <div><img src="diamond.jpg" alt="Diamond Health Club" usemap="#diamondmap" style="border-width: 0" /> <map id="diamondmap" id="diamondmap"> <area shape="rect" coords="225, 4, 333, 40" href="classes.htm" alt="Classes." title="View our classes" /> <area shape="rect" coords="258, 44, 437, 82" href="members.htm" alt="Memberships." title="View our membership options." /> <area shape="default" coords="0, 0, 548, 150" href="index.htm" alt="Home Page." title="Return to the Home Page." /> </map> </div> <hr/> <div> <a href="index.htm#fac" title="Learn more about our facilities">Facilities</a> ♦ <a href="index.htm#staff" title="Meet the DHC staff">Staff</a> ♦ <a href="index.htm#hours" title="View the DHC hours of operation">Hours</a> </div> <hr /> <h1>Membership Options</h1> <p>Diamond Health Club offers a variety of membership programs, including one sure to meet your specific needs and budget. Pick up a membership form at the club or <a href="mailto:rchi@dmond-health.com>e-mail Ron Chi </a> to request one.</p> <h3><a name="ind">Individual memberships</a></h3> <p><i>You must be eighteen or older to qualify for an individual membership.</i></p> <ul> <li><b>Gold</b>: Full access to the club and access to special Gold Member areas.</li> <li><b>Full</b>: Full access to the club during all open hours.</li> <li><b>Weekdays</b>: A low-cost option that allows you full access to the club from 10 a.m. to 3 p.m., Monday through Friday.</li> <li><b>Evenings</b>: A discount program, allowing you access to the club from 5 p.m. to 10 p.m. every day of the week.</li> <li><b>Early Bird</b>: A discount program, allowing you access to the club from 5 a.m. to 8 a.m., every day of the week.</li> <li><b>Weekends</b>: Enjoy the club on Saturday and Sunday. Perfect for <i>weekend warriors</i>.</li> <li><b>Seniors</b>: We provide special membership rates for individual seniors.</li> </ul> <h3><a name="fam">Family memberships</a></h3> <ul> <li><b>With child care</b>: This option is best for families who plan to use the children's play room, which is available for children ages 6 weeks to 12 years. The play room is open every day.</li> <li><b>Without child care</b>: Save a little on your membership if your family won't need access to the play room.</li> <li><b>Couples</b>: Memberships for married couples or domestic partners. Pick up a membership form for specific rules regarding eligibility.</li> <li><b>Seniors</b>: We provide special membership rates for senior couples.</li> </ul> <h3><a name="temp">Temporary memberships</a></h3> <ul> <li><b>Monthly</b>: For our long-term visitors this membership provides access to the club for one month.</li> <li><b>Weekly</b>: For short-time visits, this membership provides one week of access to the club.</li> <li><b>Daily</b>: A daily pass to the club and all of its facilities.</li> <li><b>Punch cards</b>: Our punch cards allow guests complete access to the Club (except child care facilities) for a specific number of full days. Punch cards make great gifts and are available for 5, 10, and 20 visits.</li> <li><b>Special events</b>: Plan your parties and special work outings at the Diamond Health Club. Our onsite coordinator can meet your every need.</li> </ul> <hr/> <div> <b>Diamond Health Club ♦ 4317 Alvin Way ♦ Boise, ID 83701 ♦ (208) 555-4398</b> <br /> <i> Your Year-Round Source for Fun Family Health </i> </div> </body> </html> Ok, I am creating a calculator with html and javascript. I am using a table to format the buttons and text displays. The code is posted below with the table itself. It is supposed to be 3 cells height and 1 cell width but it turns out as 2 cells width and 2 cells height. I can't figure out the error in my code so can someone please figure out what is wrong with my tags: HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <style type=text/css> input { background-color: black; color: white; } th { background-color: black; color: white; } td { background-color: green; } </style> <script type="text/javascript"> var a; var b; var c; var d; var e; function inputtext(inputtext) { a=document.getElementById("inputcalculation").value; b=inputtext; c=a+b; document.getElementById("inputcalculation").value=c; } function Evaluate() { d=document.getElementById("inputcalculation").value; e=eval(d); document.getElementById("outputcalculation").value=e; document.getElementById("inputcalculation").value=""; } </script> <title>Help-In-Math Calculator</title> </head> <body> <table border="1"> <tr> <th colspan="11" style="background-color: black"> <center> <input type="text" id="inputcalculation" value="" /> </center> </th> </tr> <tr> <td colspan="11" rowspan="5"> <center> <input type="button" value="1" onclick="inputtext('1')" /> <input type="button" value="2" onclick="inputtext('2')" /> <input type="button" value="3" onclick="inputtext('3')" /> <input type="button" value="+" onclick="inputtext('+')" /> <br /> <input type="button" value="4" onclick="inputtext('4')" /> <input type="button" value="5" onclick="inputtext('5')" /> <input type="button" value="6" onclick="inputtext('6')" /> <input type="button" value="-" onclick="inputtext('-')" /> <br /> <input type="button" value="7" onclick="inputtext('7')" /> <input type="button" value="8" onclick="inputtext('8')" /> <input type="button" value="9" onclick="inputtext('9')" /> <input type="button" value="X" onclick="inputtext('*')" /> <br /> <input type="button" value="0" onclick="inputtext('0')" /> <input type="button" value="." onclick="inputtext('.')" /> <input type="button" value="00" onclick="inputtext('00')" /> <input type="button" value=÷ onclick="inputtext('/')" /> <br /> <input type="button" value="EVALUATE" onclick="Evaluate()" style="background-color: blue"/> </center> </td> </tr> <tr> <td colspan=11> <input type="text" id="outputcalculation" onfocus="blur()" /> </td> </tr> </table> </body> </html> Hi, I have got a weird problem with a page I'm writing: whenever I zigzag between my tabs inside the page, each tab's content moves a little bit to the right. you can clearly see it, if you zigzag between the "Friends" tag and the "Mail" tag, and notice how the title of the content moves a little bit to the right each time... I'm attaching my two files. Does anyone has an explanation? Thanks I recently developed the following site: www.stripburgerlv.com If you view it in Firefox it may look just fine. However, in Safari, Opera or IE you'll notice that the right side of the white bounding box disappears. I dont understand?! Part of the image file includes that white edge so why would it not show up in those browsers? Thanks! |