HTML - Trouble Getting Same Look In Ie And Firefox
I'm having trouble getting the same look for my site in both Firefox and IE.
Currently, the site looks great in Firefox. It looks just as I would like it. The nav links are all lined up on the left, and the login area is nice. However, when I view it in IE, things are different. The nav links all seem to be centered somehow, causing them to not line up very well. The login area is not as tidy either - the text input boxes are different sizes, even though they are both marked to hold 10 characters. Anyone have any idea how I can get the look that is working in Firefox to also work in IE? The website URL is www.learn-korean-now.com Thanks. Similar TutorialsHello everyone, The forums here are very helpful and i would like to thank everyone for posting. My trouble is simply when I was designing the website it was done a firefox browser and everything was perfect and in the right place, When I attempted to visit the website in a IE browser the logo is out of place as well as the side navigation, It appears that the side navigation is always below the content to the right of it. http://www.blackwidowinc.com Any help is greatly appreciated. Hi All! We have a webapp running in Resin using Wicket 1.3. We used an iframe in one of our pages, for credit card 3D authentication, so that the visible URL won't change. <iframe id="ifrm" name="ifrm" src="images/3DForm.html" frameborder="0" > </frame> This seems to be working fine, except that in Firefox 2.0, the height attribute is all crazy. If we set height="100%" or "auto", the frame opens up with a height of abt 2 inches. Setting a pixel count as height increases height, but since it's not dynamic, doesn't really give us what we want. (Since there are a frew more pages of varying sizes that are displayed on thgis iframe.) Setting the inline style attributes 'height' didn't help either. But on IE 6, setting height=100% or 'auto' seems to work fine. Any help u cud give us on this wud be greatly appreciated. Or, if anyone knows a better way to go for 3D Auth, without changing the address-bar url, pls let us know. Thank you! Hello, I am pretty new to the whole html world so forgive me if this is a simple problem. I have look all over for a post explaing this problem but i haven't found anything. I am making a site for a friend using Dreamweaver. I know i know, i regret not coding it from scratch but its too late now. Anyways I have a pretty good page layout going now but I have ran into a problem with loading my images. On my home page an image in a table nested inside another table will load when viewing in safari but seems to disappear in firefox. What is going on? Its a pretty simple piece of code. I place; <img src="Pictures/RDV couplepalm.jpg" width="200" height="" style="float:right; padding: 8px; margin-left:10px; margin-bottom: 10px" / inside of a paragraph in a row of a table. I have rewritten the code for this image, copied it from a working image and screwed around with the table heights (although I wasn't too sure what i was doing). What else should I try? I have attached screen shots of the site in both browsers a copy of the problem jpeg aswell as a copy of the html. Any information anyone could givee me would be REALLY appreciated! Thank you. Dear friends i have in big trouble. so i want yours help. i make one website. i put there many HTML codes. i put there .. not image click HTML code .. now when i configuration my main page the HTML codes not opend. but i do inside pages configurations. but i put ,,, not image click HTML code ,,, on main page so i want give me HTML code i put on my site. they all HTML code stoped working or dead .when i delet ... not image click HTML code ... after i remove HTML stoped working code. i hope some 1 help me awatings yours I am currently working on a website for my fraternity and am using geocities as a temp service to get my site correct before I get a .org name. For some reason Internet Explorer won't show anything, but when you use Mozilla it shows up just fine. I checked to see if it was just geocities that was messed up, but it did the same thing with cjb.net, so I'm stumped. I don't know what's wrong with my code, everything seems fine, there's no deprecated tags or anything of that nature. Here's a link to the website. Any help would be greatly appreciated. Basically, I am making a website for someone but I am having a bit of DIV trouble. The part I am having trouble with is the content box. I have a content box that I need to be fixed (width) and it needs to stretch vertically when there is content on the page that will overfill the original page. There is then a div under this content which is a footer type image. This needs to move down when the content fills the above box.. I can't get this too work, all it does is strech horizontally, and when I stretch it vertically it just shows up blank... Any ideas? First, I'm no expert, but I can work my way around a bit of HTML If you're familiar with myspace pages, great! I'm working on a band profile, which is trickier than a user profile (at least, if you want it to look legit): http://www.myspace.com/489097511 It still needs a lot of work, but the reason I'm looking for help is the bottom of the page (user information, online now, last logged in, general info...etc) I'm curious as to how I can place a layer over it, on which I can post whatever I want I can't seem to get a div to cover that area, and if I do, it only ever appears under all the info I want to cover. Any help is much appreciated! http://tunnu.hyperphp.com/social/home.php this is my site.. i am unable to find where to edit that default text Code: Welcome to the social network! This page is an example of what your social network's portal can look like. Various statistics about your social network can be displayed, as exemplified below. This gives users a convenient way to find the newest content and interesting people on your social network. You can also use this page to display news or any other content you place into the template. i am able to find the codes for those gif images.. but i dont find how to change this text.. this is a socialnetwork script.. plz help.. i am in real need of help.. THANKS IN ADVANCE TUNNU Hi, Im sorry about this embarrassing problem lol. Im having trouble with some tables im putting on my page. Im basically wanting to place a table in the top left hand side of the page... and a seperate table on the Right hand side of the page. But i dont know how to do that because it obviously goes underneath eachother lol I have attached a jpeg to show you how id like my tables . if somebody could help me with the code that would be great .. thanks Scott ok i was wondering whats wrong with my background could some1 tell me if thiers something wrong with my code, the problem i have is the background appearing i do everything it says to but it still dosent work <html xmlns="http.thewaywardgamer.com> <head> <title>the way of the gamer</title> </head><body> <html> <body background="image.jpg"> <p align="center"><font size="50"><font color="#cccc80"><b>WELCOME TO GAMERWORLD</b> </font></p> <p> </body> <SCRIPT TYPE="text/javascript"> <!-- function dropdown(mySel) { var myWin, myVal; myVal = mySel.options[mySel.selectedIndex].value; if(myVal) { if(mySel.form.target)myWin = parent[mySel.form.target]; else myWin = window; if (! myWin) return true; myWin.location = myVal; } return false; } //--> </SCRIPT> <FORM ACTION="../cgi-bin/redirect.pl" METHOD=POST onSubmit="return dropdown(this.gourl)"> <SELECT NAME="gourl"> <OPTION VALUE="">Choose a Destination... <OPTION VALUE="http://www.purezc.com" >purezc <OPTION VALUE="http://www.youtube.com" >youtube <OPTION VALUE="http://www.miniclips.com" >miniclips <option VALUE="file:///C:/Documents%20and%20Settings/Owner/Desktop/games.html">bunker </SELECT> <INPUT TYPE=SUBMIT VALUE="Go"> </FORM> <p> <p align="left"><font size="4"><font color="#660066">hello all and welcome to the world of gamers.where nintendo is our god.</font></P> <MULTICOL COLS=3> <UL> <lI><A HREF="links.html">Click Here for My Favorite Links</A> <li><A HREF="games.html">Click Here for Flash Game bunker</a> </UL> </MULTICOL> <br> <br> <br> <br> <body> Our address by FAN mail:<P> <ADDRESS> p.o box 183,perkinsvile vermont </ADDRESS> </body> <body> <!-- Begin Google Search --> <input type="hidden" name="cx" value="partner-pub-6155056320102818mfj3qxh2mm" /> <input type="hidden" name="cof" value="FORID:10" /> <input type="hidden" name="ie" value="ISO-8859-1" /> <input type="text" name="q" size="25" /> <input type="submit" name="sa" value="google search" /> <!--img src="/acustom/google.gif" border="0" alt="Google" style="vertical-align:top;" /--> <!-- END Google Search --> </html I built my page using Firefox to view it and it looks how I want it but in IE (and possibly all other browsers?) it doesn't look right. My html and css validates (with W3C), so I guess I'm relying on a Firefox bug or something. Here's the page: individual.utoronto.ca/nicolemorgan One of the problems seems to be that in Firefox, on my web page, a certain table cell is defined by the width of the top cell in the same column and wraps its contents (which is text), whereas in IE the width definition isn't recognized and the text isn't wrapped. My temporary solution is to manually break the lines of text so that they fit within the cell dimensions, but this feels messy. (The column in question is where the tan-coloured blocks are on the left side of the page.) Other problems are that some of the cells don't line up, and there is a thin line between two certain cells in IE but not Firefox. Is there some basic principle I'm missing, or is my code just messy, or what? I and new to the forum - I am a bit disappointed in myself for not solving this myself However any assistance is appreciated I purchased a Template and tweaked the psd file to make a secondary page, I was able to delete some slices to trim the page down to what I want http://www.naturalstone.ca/index_do.html the large white space on the right I would like to remove the reference to the jpg image and insert bgcolor="#5F0401" into the <td rowspan="8> because I plan to add content that will scroll well down that page ------code ------- <td rowspan="8"> <img src="images2/index_do_03.jpg" width="549" height="680" alt=""></td> ----------- Every time I try to edit the <td rowspan="8"> it totally screws up the left menu and the page itself any ionfo appreciated - I am about to eat the keyboard over this ~ian I have this coding: <table style="display:inline;border-collapse:collapse;border:0"><tr> <td style="padding:0"><img src="transparent.gif" align="center" width="1" height="200" style="background:red"> </td></tr></table> But the red line is on the top left when I need it in the center middle.....can someone please help me get it into the center middle..or is there another way of making that line but more easy and simple? Thanks! First I want to say that this forum is great and has been alot of help. I also want to thank bsxiong for his help already. If I could send you a beer electronically, I sincerely would. I had two problems initially, and one has been fixed very easily. Thank you. However, the solution to the other still eludes me. I don't have the page on the domain yet, and can't until it's finished. I uploaded the link to geocities so that you can see the page. I didn't include the style sheet, but hopefully this gives the general layout of the page. http://www.geocities.com/thecyberrev/newly.html On the page, there is a pic to the left below the top banner. Below the pic is the bold text, "Home". Below that text is a thin divider line and more text that reads, "Building organizations that build lives.". Basically all I am trying to do is move the text, Home to the left of the pic and enlarge it so as to act as a title for the page. (This would below the blue header banner in the large white blank area) Everything I seem to do either puts the text just below or just above the pic. What am I doing wrong? I think it's something very simple but it's eluding me. Please excuse my ignorance. Any advise would be greatly appreciated. Okay, as you can see from my screenshot, my problem is that the two images in the bottom cells are not at the very bottom, i am not sure how i align them so that they are. And heres the code: Code: <html> <head> <title> Fun Maths </title> <style type="text/css"> <!-- body { background: #336699; } p { text-align: justify } --> </style> </head> <body> <div align="center"> <table border="0" width="500" height="100%" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0"> <tr height="15"> <td> <img src="whiterb1.gif" border="0" /> </td> <td> </td> <td> <img src="whiterb2.gif" border="0" /> </td> </tr> <tr colspan="3"> <td> Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello </td> </tr> <tr height="15"> <td> <img src="whiterb3.gif" valign="bottom" border="0" /> </td> <td> </td> <td> <img src="whiterb4.gif" border="0" /> </td> </tr> </table> </div> </body> </html> I'm in a beginners HTML course. I need to put an image next to a table on the same line. From what I've read, I think I have to make a table within a table to make this work. I realize CSS would be better but it's an HTML class and this is what the teacher wants. <table border="1"> <tr> <td>Link</td> <td>Link</td> <td>Link</td> </tr> <tr> <td>Name</td> <td>Name</td> <td>Name</td> </tr> </table> Now I need the image on the right side of that table. How would that work? If I align it to the right, it goes on the right side of the page. I need it next to the table, with only a tiny space in between. Any help? I also need the table to stay exactly the same. When I tried different ways of putting the image inside the table it just screwed up the sizing of the table. Thanks. Hi, I am putting together a quick site, I don't normally use iframes but wanted to use it for a forum so I could imbed it into my theme. When I use the iframe code: Code: <iframe src="http://www.mypokerbuds.com/Forum" width="675px" height="1000px" frameborder="0"> It works great, but the bottom graphic of my template is missing, you can see the forum page he http://www.mypokerbuds.com/Forum.htm On the homepage you can see what the bottom graphic is suppose to look like: http://www.mypokerbuds.com/index.html Does anyone know what is causing this graphic to not show up? Thanks, Nick I'm running into IE 7 and earlier problems that I just can't seem to solve even though I have applied the suggested Adobe fixes and some others found on-line. The site can be found at: http://www.infusiongraphics.com/UCOg...ite/index.html and css at http://www.infusiongraphics.com/UCOg...erontology.css . For some reason, probably something easy that I'm overlooking, the fixes don't want to work. The bug is "Extra Whitespace in List Link Bug". The problem is occurring in the two drop down menus in the top navigation. I also noticed some extra space at the top, above the content and the top of the browser window. These are only visible in IE 7 or lower. Can anyone help? Hi I'm trying to make a menu that has sub-menus within it. It will be a vertical menu and right now I'm still working it out so it's not as graphically pleasing as I intend it to be. But before I go any further in the menu I'm trying to figure out how to get the submenu to have links in it. I was just wondering if someone could lend their input on how to get the sub-menus to have links.Here's the Code(I included the style in the page)- Code: <html> <head><style> #menu { width:100px; text-align:center; position:absolute; left: 50px; margin:2em auto; z-index:99999; border-right:10px #000000; } .box { position:relative; z-index: 99999; border-right:10px #000000; } #menu a, #menu a:visited { text-decoration:none; background-color:#fff; color:#c00; display:block; width:140px; height:21px; font-size:14px; border:1px solid #fff; border-right:10px #000000; padding:5px; } * html #menu a, * html #menu a:visited { width:150px; height:35px; w\idth:88px; he\ight:16px; border-right:10px #000000; } #menu a span { display:none; } #menu a:hover { border-right:10px #000000; } #menu a:hover span.left, #menu a:hover span.right { /*outside area of arrow*/ display:block; position:absolute; height:0; width:0; overflow:hidden; border-top:8px solid #fff; border-bottom:8px solid #fff; } #menu a:hover span.left { /*arrow*/ left:5px; top:5px; border-left:8px solid #c00; } #menu a:hover span.right { left:150px; top:5px; border-right:8px solid #c00; } * html #menu a:hover span.left, * html #menu a:hover span.right { width:8px; height:16px; w\idth:0; he\ight:0; } #menu a:hover span.lk { /* extra infor spot*/ display:block; position:absolute; left:140px; top:0; padding:5px; width:150px; background-color:#fff; color:#000; border:1px solid #234; } </style></head><body> <div id="menu" style="z-index:9999999;"> <br><br><br><br><br> <div class="box"> <a href="#nogo">Item 1 <span class="left"></span> <span class="right"></span> <span class="lk"> Description of link 1 </span> </a> </div> <div class="box"> <a href="#nogo">Item 2 <span class="left"></span> <span class="right"></span> <span class="lk"> Description of link 2 </span> </a> </div> <div class="box"> <a href="#nogo">Item 3 <span class="left">dhsf</span> <span class="right">dshsdg</span> <span class="lk"> Description of link 3 </span> </a> </div> <div class="box"> <a href="#nogo">Item 4 <span class="left"></span> <span class="right"></span> <span class="lk"> Description of link 4 </span> </a> </div> <div class="box"> <a href="#nogo">Item 5 <span class="left"></span> <span class="right"></span> <span class="lk"> Description of link 5 </span> </a> </div> </div> </div></body><html> Thanks for your input. Hi everyone, I have a ajax contact form at http://nbveincare.com/contact3.php which is only partly visible . Tabbing through the fields will show all the fields, but there is some problem with proper sizing. Would anyone mind taking a look at this and giving me some pointers on what to do next? Thank you, Dan |