HTML - Problem Displaying In Firefox
Hello all,
Im having problems displaying my website in firefox, it displays fine in IE, however its displaying 1/2 way down the page in firefox. Any ideas where im going wrong? www.best-mobile-contracts.co.uk Similar TutorialsHi...I am looking to create a vertical solid bar, in an HTML table. But it's not displaying right in Firefox! In IE it's fine...I want the bar to go to 100% of the <td> cell. Here is what I have: <td rowspan="2"> <center> <img src="bluepixel.gif" style="width: 5px; height: 100%;" /> </center> </td> bluepixel.gif is a 1x1 pixel GIF file. Basically I'm creating a vertical colored version of a <hr> tag. Again...in IE it fills out 100% of the height. But Firefox only shows a 5x5 square...no matter how big the browser is resized. Any ideas?? Thanks! Jason Hi, Im a bit of an amateur and for some reason I cant get an image to display in firefox, but its fine in explorer.... Does anyone know why this might be? Thanks Aly_ve hello, the attached below is a position template for displaying merchandise. in IE the html shows properlly with no internal borders. in FIREFOX (version 1.5.0.9), the cells and tables are all bordered. i have now intentionally put - BORDERCOLOR="FFFFFF' and BORDERWIDTH="0" -wherever i possibly could in order to try and eliminate the borders from showing in firefox - to no avail. any suggestions? weblost here is the link if you prefer to view it. the position is the one marked "test 2" http://cafepanik.com/lobby/3_sneekee...ial/index.html I have created a div which sits on the right hand side. I have created two different size ones as one of my html pages has a lot more content on it. here are in the divs in CSS:
Code: #picstrip{ width:200px; height:740px; padding: 10px 10px 20px 10px; background-color:#8d6cd1; z-index:999999; float:right; } #picstrip2{ width:200px; height:1270px; padding: 10px 10px 20px 10px; background-color:#8d6cd1; z-index:999999; float:right; } I want these divs to be touching the footer i have created: Code: #footer{ background-color:#2ba475; width:800px; font-size:10px; font-family:Verdana, Arial, Helvetica, sans-serif; font-weight:bold; } table.foot{ text-align:center; } I am currently able to make it work it just one of the web browsers at a time. The div seems to be shorter in size in IE. is there any way round this problem? I will be so greatful for any help. Thank You I am experiencing frustration due to the website that I've designed is being displayed perfectly in the Explorer browser, but in Firefox its all screwed up. Is it coding issues? My website is at www.wolfdenexpeditions.ca cheers hi guys. I am trying to get rounded edges to appear around my tables when displayed in Firefox. However, while it does display rounded edges, it also displays an angular border, which takes whatever colour the text has. here is the code. Quote: <!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" /> <!-- TemplateBeginEditable name="doctitle" --> <title>Untitled Document</title> <!-- TemplateEndEditable --> <style type="text/css"> <!-- #MainCell { border-top-color: #FFF; border-right-color: #FFF; border-bottom-color: #FFF; border-left-color: #FFF; width: 800px; background-color: #FFF; height: 1000px; } .whitebackground { } #LogoCell { background-color: #006; height: 15px; } #LinksCell { background-color: transparent; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; width: 77%; } #ContentCells { text-align: center; } #BottomLinksCell { } table { -moz-border-radius: 30px; border: #cc2800; } body { background-color: #006; color: #0F0; border: transparent; } .TableBackground { border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; } --> </style> <!-- TemplateBeginEditable name="head" --> <!-- TemplateEndEditable --> <link rel="stylesheet" href="../ajxmenu.css" type="text/css" /> <script src="../ajxmenu.js" type="text/javascript"></script> </head> <body> <table width="100%" border="1" align="center" id="MainCell"> <tr> <th scope="row"><table width="100%" border="1" id="LogoCell"> <tr> <th class="whitebackground" scope="row">LogoCell - I'll see if my guy will do something for you or if you can get a mate to, if not I'd go to a professional</th> </tr> </table> <table width="78%" border="1" align="center" id="LinksCell"> <tr> <th scope="row"><div class="AJXCSSMenueDFaTFD"><!-- AJXFILE:../ajxmenu.css --> <div class="ajxmw1"> <div class="ajxmw2"> <ul> <li><a href="#"><b>Home</b></a></li> <li><a class="ajxsub" href="#"><b>Gallery</b></a> <ul> <li class="sfirst slast"><a href="#">Slideshow</a></li> </ul> </li> <li><a class="ajxsub" href="#"><b>Corporate Work</b></a> <ul> <li class="sfirst slast"><a href="#">Testimonials</a></li> </ul> </li> <li><a class="ajxsub" href="#"><b>About Us</b></a> <ul> <li class="sfirst"><a href="#">Qualifications</a></li> <li class="slast"><a href="#">Business Associates</a></li> </ul> </li> <li class="tlast"><a href="#"><b>Contact Us</b></a></li> </ul> </div> </div> <br /> </div> </th> </tr> </table> <!-- TemplateBeginEditable name="ContentRegion" --> <table width="68%" border="1" align="center" id="ContentCells"> <tr> <th width="50%" height="113" scope="row"><p> </p></th> <td width="50%"> </td> </tr> <tr> <th height="135" scope="row"> </th> <td> </td> </tr> </table> <!-- TemplateEndEditable --> <table width="100%" border="1" id="BottomLinksCell"> <tr> <th scope="row">BottomLinksCell</th> </tr> </table> </th> </tr> </table> </body> </html> Can anyone tell me how I can get rid of the angular border, and just be left with the rounded one? Thanks! Hi guys, i'm having some problems displaying my table text (it's getting out of table borders, which are hidden.). It has some Javascript on it and as well css, but i wasn't sure where to post, so if this is a wrong section, please move it, and i feel so sorry. Here's the link: http://hpdiscoversrbija.rs/agenda3.html And here's the full code: PHP 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>HP Discover Srbija</title> <script type="text/javascript"> <!-- function toggle(box,theId) { if(document.getElementById) { var cell = document.getElementById(theId); if(box.checked) { cell.className = "on"; } else { cell.className = "off"; } } } // --> $(function () { // this line makes sure this code runs on page load $('.checkall').click(function () { $(this).parents('fieldset:eq(0)').find(':checkbox').attr('checked', this.checked); }); }); </script> <style type="text/css"> div.centered { text-align: center; vertical-align:middle } div.centered table { margin: 0 auto; text-align: center; vertical-align:middle } tr.Selected { background-color:#ff0000; } tr.Selected label { font-weight:bold; color:#000080; } table td label { display:block; width:100%; height:100%; padding:10px; cursor: pointer; } #ctl00_ContentPlaceHolder1_gvCustomers { color:#000; background-color:#fff; border-color:#ccc; border-width:1px; border-style:solid; font-family:verdana,sans-serif; font-size:11px; border-collapse:collapse; } <!-- .off { background-color: #FFE9D3; cursor: pointer; } .off:hover { background-color: #8b8b8b; } .on:hover { } .on { background-color: #4c535c; color: white; } .style35 { font-weight: bold; font-size: 16px; color: #FFFFFF; } td { vertical-align: middle; } --> </style> <body> <div class="centered"><table cellspacing="0" style="background-color: #FFE9D3;" cellpadding="0"> <col width="61" span="2" /> <col width="61" /> <col width="145" span="7" /> <tr> <td align="center" width="61">Start*</td> <td align="center" width="61">End</td> <td align="center" width="61">Duration</td> <td align="center" colspan="7">AGENDA - DRAFT</td> </tr> <tr> <td height="29" align="center" >9:30</td> <td align="center" >10:00</td> <td align="center" >0:30</td> <td align="center" width="100"> </td> <td align="center" width="100"> </td> <td align="center" colspan="3">Registration and welcome drink</td> <td align="center" width="100"> </td> <td align="center" width="100"> </td> </tr> <tr> <td height="80" align="center" >10:00</td> <td height="80" align="center" >10:30</td> <td height="80" align="center" >0:30</td> <td width="100" height="80" align="center" class="off" id="cell1"> <input type="checkbox" style="display:none;" id=bla1 onclick="toggle(this,'cell1')"><label for=bla1>KEY NOTE - Enterprise ON*</label> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> </tr> <tr> <td height="80" align="center" >10:30</td> <td height="80" align="center" >11:00</td> <td height="80" align="center" >0:30</td> <td width="100" height="80" align="center" class="off" id="cell2"> <input type="checkbox" style="display:none;" id=bla2 onclick="toggle(this,'cell2')"><label for=bla2>KEY NOTE - IT TRENDS</label></td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> </tr> <tr> <td height="80" align="center" >11:00</td> <td height="80" align="center" >11:30</td> <td height="80" align="center" >0:30</td> <td width="100" height="80" align="center" class="off" id="cell3"> <input type="checkbox" style="display:none;" id=bla3 onclick="toggle(this,'cell3')"><label for=bla3>KEY NOTE - HP Converged Infrastructure</label></td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> </tr> <tr> <td height="80" align="center" >11:30</td> <td height="80" align="center" >12:00</td> <td height="80" align="center" >0:30</td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center">Break</td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center"> </td> </tr> <tr> <td height="80" align="center" >12:00</td> <td height="80" align="center" >12:00</td> <td height="80" align="center" >0:00</td> <td width="100" height="80" align="center" class="off" id="cell4"> <input type="checkbox" style="display:none;" id=bla4 onclick="toggle(this,'cell4')"><label for=bla4>CIO TRACK</label></td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center" class="off" id="cell5"> <input type="checkbox" style="display:none;" id=bla5 onclick="toggle(this,'cell5')"><label for=bla5>NPI TRACK</label></td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center" class="off" id="cell6"> <input type="checkbox" style="display:none;" id=bla6 onclick="toggle(this,'cell6')"><label for=bla6>Infrastructure Solutions TRACK</label></td> <td width="100" height="80" align="center"> </td> <td width="100" height="80" align="center" class="off" id="cell7"> <input type="checkbox" style="display:none;" id=bla7 onclick="toggle(this,'cell7')"><label for=bla7>Business Solution TRACK</label></td> </tr> <tr> <td height="80" align="center" >12:00</td> <td height="80" align="center" >12:30</td> <td height="80" align="center" >0:30</td> <td width="100" height="80" align="center" class="off" id="cell8"> <input type="checkbox" style="display:none;" id=bla8 onclick="toggle(this,'cell8')"><label for=bla8>Cloud Business</label></td> <td width="100" height="80" align="center" class="off" id="cell9"> <input type="checkbox" style="display:none;" id=bla9 onclick="toggle(this,'cell9')"><label for=bla9>Matej Kurent</label></td> <td width="100" height="80" align="center" class="off" id="cell10"> <input type="checkbox" style="display:none;" id=bla10 onclick="toggle(this,'cell10')"><label for=bla10>Cloud News</label></td> <td width="100" height="80" align="center" class="off" id="cell11"> <input type="checkbox" style="display:none;" id=bla11 onclick="toggle(this,'cell11')"><label for=bla11>Jelena Bratic</label></td> <td width="100" height="80" align="center" class="off" id="cell12"> <input type="checkbox" style="display:none;" id=bla12 onclick="toggle(this,'cell12')"><label for=bla12>Virtual System - Infratstructure Conslodiation</label></td> <td width="100" height="80" align="center" class="off" id="cell13"> <input type="checkbox" style="display:none;" id=bla13 onclick="toggle(this,'cell13')"><label for=bla13>Nemanja Milutnovic</label></td> <td width="100" height="80" align="center" class="off" id="cell16"> </tr> </table></div> </body> </html> P.s. i had to cut it somewhere 'cause of limits of posting! I would also like to know how to center text vertically, as i couldn't... Thanks a lot! Hello! Please ceck: http://htlounge.net/testing Near to logo is a adsense banner.. 468x60. In IE and Opera is displaying ok! But in Firefox not.. It is a white space! What is the problem! Thank you! Hey all, I'm having a problem with html input text fields. I'm trying to display a name in it but it only shows the first part of that name. Here is the part of the code I'm using for one of those : Code: <label>Name <span class="small">Name sent</span> </label> <input type="text" name="name" id="name" value=<?php echo $_POST["name"]; ?> /> If, as example, the name I'm getting from $_POST is : Alexander Johnson, there will only be Alexander in the text field. Note that if I create a really small function like this : Code: $name = $_POST["name"]; echo $name; Then the output will be Alexander Johnson instead of simply Alexander. Anyone knows what I'm doing wrong? (I'm using the labels and span class with css, but I don't think this is the problem. Hi, Ive got a bit of a problem with the website im creating. This is the bit of code thats affecting the browser (I believe). <div class="header"><img src="truelogo.gif" /></div> For some reason It works perfectly in safari, but not in IE or firefox. I wont post all the source code here as there is quite alot, but the website is alesofdevon.com/betatest/mysql.php?id=1 if you need anymore info from it. Thanks Scott. How do I get the Content Management System Admin features: block to move down slightly. It looks fine in IE but firefox its not looking right http://www.upfrontdesigns.co.uk/build/services.html I'm new to web design so I hope this makes sense to someone. I am trying to make a website for a new buisness, I'm using text wrangler on a mac to write the code and have been checking my progress in Safari. I have just checked the site on firefox and the banner at the top isn't showing up? This is the html: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Peris & Corr</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <link rel="stylesheet" type="text/css" href="styles.css" /> </head> <body> <div id="container"> <div class ="img"><img src= "logowebsite.jpg"</div> <div id="wrapper"> <div id="content"> <p><strong>What we do:</strong></p> <p>- create a range of hand made textile products and greeting cards <p>- offer an eco frienly screen printing service, printing only with water based inks on to ethically sourced garments</p> <p>Montegeraliquam sed pede in cursus praesenec vestas rhoncus wisi at wisi. Condisseloborttis enim et ipsum mauristie id felit adipiscipit ac auctortorttitor sempor. Vitantesqueat sempus non sed et mus sit vivamus purus netus hendiment. Pretiuma diam et id tempus dolor por wisi sed volutpat facilisi.</p> <p>Wisiet sus adipit phasellentum elit condissim consecteturpiscing sapien vivamus et congue. Utvel tris quismod cursus liberos elit nisse curabitur tur parturpis tellenterdum. Semperligula curabitae tellentesque nulla trices vestas ristibulum id justo auctor facinia. Natisdonec consequat nibh pellus.</p> <p>Vestibusodio euisque id elerisus lacus tincidunt sit malesuada lacus pellus parturpiscing. Pellenterdumat maecenatoque cras a magna nibh et quis diam ames et. Laoremvolutpat ac dolor eget eget temper lacus vestibus velit lacus venean. Magnaipsum tellus morbi leo aliquat nulla convallis pellentesque.</p> </div> </div> <div id="navigation"> <ul> <li><a href="home page.html"><strong>home page</strong></a></li> <li><a href="products.html"><strong>products</strong></a></li> <li><a href="screen printing.html"><strong>screen printing</strong></a></li> <li><a href="about us.html"><strong>about us</strong></a></li> <li><a href="stockists.html"><strong>stockists</strong></a></li> <li><a href=http://perisandcorr.blogspot.com/><strong>blog</strong></a></li> <li><a href="contact us.html"><strong>contact us</strong></a><li/> </ul> </div> <div id="extra"> <img src= "bags.jpg"> <img src= "ink.jpg"> </div> <div id="footer"> <p>Footer</p> </div> </div> </body> </html> I hope someone can help, and that there is a simple solution. Thanks hi all, recently i'm making a site and i have made a link to go to you last page using java script. but when i hover over it in interneet exporer my cursor turns in to a hand but when i hover over it in firefox nothing happens. the code i use to get the hand is "style="cursor:hand" ". can someone pls help me ? ty Hi all. I'm very new to html/css code, but have managed to create a decent looking webpage so far. Well, up until last night anyway! I added three text images to my page, and it looks good when viewing with FireFox. It use to even look ok when viewed using IE, but now my NavBar is all screwed up, and the header image will not show. Could someone please take a look at the source code, and my style sheet, and let me know what could have went wrong? Thanks! Hi, <input name="Submit2" value="1" type="image" id="Submit2" src="images/Freshupdaterecordbutton.jpg" alt="Update" width="160" height="50" border="0"> The above image is a button within a form. If I click on the button, I can check the parameters passed via the form. The following tells me how long the "Submit2" parameter is using ASP strRequest = Request.Form("Submit2") strRequest = len(strRequest) response.Write(strRequest) Response.end() In Firefox 2, the length of "Submit2" is 1 In IE 7, "Submit2" is 0 I need them both to be 1. How can I do this? Is it something to do with the NAME and ID tags? The NAME and ID tags are unique on the form. Cheers, Alski Hello all, I'd like to say this is my first post here on this forum and I am in need of some help... I have a website that I am re-programming / designing because when I started it I was not as good as I am now at development (I'm currently 16 years old) The problem is in HTML and I can't figure it out to save my life... I have 3 tables in HTML on my homepage, one is for whether or not the person is logged in, tells them to login to use features. Another for image links for main areas of the website Another for statistics... In firefox it does what I want: In IE, I get this interesting error... Source: Code: <table width=810 align=right cellpadding=0 cellspacing=0 border=0> <tr> <td> <!-- IF NOT_LOGGED --> <table width=810 align=right cellpadding=2 cellspacing=0 border=0 align=right> <tr> <td class="urgent" width=20><IMG src="{STYLE_DIR}images/icon_urgent.gif"></td> <td class="urgent">You must be <a href="login.php">logged in</a> to use the features of this department.</td> </tr> </table><br> <!-- ENDIF --> <table width="810" height="30" border="0" cellpadding="0" cellspacing="0" align=right> <tr> <td width=5 class="row2"></td> <td> <img src="{STYLE_DIR}images/goal_sigs.jpg" width="200" onMouseOver="this.src='{STYLE_DIR}images/goal_hover.jpg'" onMouseOut="this.src='{STYLE_DIR}images/goal_sigs.jpg'" height=30></td> <td> <img src="{STYLE_DIR}images/stat_sigs.jpg" width="200" onMouseOver="this.src='{STYLE_DIR}images/stat_hover.jpg'" onMouseOut="this.src='{STYLE_DIR}images/stat_sigs.jpg'" height=30></td> <td> <img src="{STYLE_DIR}images/rank_sigs.jpg" width="200" onMouseOver="this.src='{STYLE_DIR}images/rank_hover.jpg'" onMouseOut="this.src='{STYLE_DIR}images/rank_sigs.jpg'" height=30></td> <td> <img src="{STYLE_DIR}images/develop_sigs.jpg" width="200" onMouseOver="this.src='{STYLE_DIR}images/develop_hover.jpg'" onMouseOut="this.src='{STYLE_DIR}images/develop_sigs.jpg'" height=30></td> <td width=5 class="row2"></td> </tr> </table><br> <table width=810 align=right cellpadding=2 cellspacing=0 border=0> <tr> <td class="row1" colspan=2>Signature Database</td> </tr> <tr> <td class="row2">Total Signatures Created: {TOTAL_SIGS}</td> <td class="row2">Total Members: {TOTAL_MEMBERS}</td> </tr> </table> This file runs off a template class I built so that would help explain {VAR} and stuff such as that. Any help please? Why is IE being stubborn and firefox not? Similar problem to fender967, my website: http://www.freewebs.com/microbitztest/ looks fine in IE but not in firefox??? Whats that all about? Hi, I've been struggling with a formatting difference between IE & Firefox. I'd be really grateful if someone would be able to advise me what I'm doing wrong. URL : http://www.demoncraft.com/helpdesk/ticket.html Any help would be appreciated JON Hello, In Internet Explorer, the following page shows just fine: www.myspace.com/milqud However, in Firefox, there's small gaps between the images and Flash files. I'd like to remove these gaps. How do I go about doing this? Here's the html code I'm using: HTML Code: <img src="http://www.milqud.com/myspace/topleft.jpg" width="390" height="520" border="0"> <object enableJSURL="false" enableHREF="false" saveEmbedTags="true" allowScriptAccess="never" allownetworking="internal" type="application/x-shockwave-flash" allowScriptAccess="never" allownetworking="internal" height="520" width="410" data="http://www.milqud.com/myspace/topheader.swf"> <param name="allowScriptAccess" value="never" /> <param name="allowNetworking" value="internal" /> <param name="movie" value="http://www.milqud.com/myspace/topheader.swf" /> </object> <br> <img src="http://www.milqud.com/myspace/mainbg.jpg" border=0> Hi, I'm having an issue with Firefox 3 that is stumping me. My site has a SWF centered in the middle of my page which is embedded with swfobject v2.1. When the page loads my SWF overlaps the right-sided border of the div I've setup in Firefox, and from what I can tell, Firefox sets the border property on the inside of the div, whereas all the other browsers set the border property on the outside of the div. I've read up on the box model problem, but seeing as how every other browser(IE, Opera, Safari, Chrome etc.) displays the page properly, I'm hitting the wall here. I don't know if swfojbect is causing the problem, or if it's something in my code, because up until I embedded the flash, I'm pretty sure everything was aligned. Anyways, any help would be greatly appreciated... http://www.lakeviewchurch.com/new |