HTML - Inconsistent Page Sizes
Similar TutorialsThis url : http://www.lincolnsrealdeals.com/nav5c.html has passed validation and renders the way I need it to on firefox, but not on ie8. The problem is that the hover over "By Location" renders the notation: "Where do you want to buy it?" under all the navigation when it's meant to render just to left of "By Location" as it does with firefox. I thought that the notation's appearance under all the navigation was a clue, but it's no help for me . What do you think? 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 name="description" content="Save money" /> <META http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>savebop </title> <style type="text/css"> body{font-family:arial;} a{color:blue;text-decoration:none;font-size:150%; width:200px;} a.one:visited {color:blue;} a.one:hover {color:red;} table.menu { width:200px; font-size:75%; visibility:hidden; } </style> <script type="text/javascript"> function showmenu(elmnt) { document.getElementById(elmnt).style.visibility="visible"; } function hidemenu(elmnt) { document.getElementById(elmnt).style.visibility="hidden"; } </script> </head> <body> <table > <tr> <td onmouseover="showmenu('location')" onmouseout="hidemenu('location')" > <a class="one" target="_blank" style="outline:none;position:absolute;left:120px;top:220px;" href="jf3.php">By Location</a> <table style="position:absolute;left:285px;top:221px;" class="menu" id="location" > <tr><td onmouseover="showmenu('location')" onmouseout="hidemenu('location')" class="menu"><a class="one" target="_blank" href="jf3.php">Southpointe</a></td></tr> <tr><td onmouseover="showmenu('location')" onmouseout="hidemenu('location')" class="menu"><a class="one" target="_blank" href="jf3.php">Williamsburg</a></td></tr> <tr><td onmouseover="showmenu('location')" onmouseout="hidemenu('location')" class="menu"><a class="one" target="_blank" href="jf3.php">40th & Old Cheney</a></td></tr> <tr><td onmouseover="showmenu('location')" onmouseout="hidemenu('location')" class="menu"><a class="one" target="_blank" href="jf3.php">56th & Old Cheney</a></td></tr> <tr><td onmouseover="showmenu('location')" onmouseout="hidemenu('location')" class="menu"><a class="one" target="_blank" href="jf3.php">14th & Pine Lake</a></td></tr> <tr><td width="65px" style="position:absolute;left:30px;top:210px;" onmouseover="showmenu('location')" onmouseout="hidemenu('location')" class="menu" > Where do you want to buy it?</td></tr> </table> </td> </tr> </table> </body> </html> Hello all, This is my first post to this forum. I hope somebody can help me with the two problems I am having because I have tried to solve them for hours and have not gotten anywhere. I just don't have enough knowledge so your help would be appreciated. Here is the link to a demonstration page I created: http://sikhfaith.com/demo/ In Firefox 2.0, the huge header picture is displayed flush with the top of the page, as I want it to be. Yet in IE 7.0, there is a small white gap above the header. I can't seem to figure out how to get rid of it in IE so that the display is consistent between browsers. Second, in IE 7.0, you can see the menu bar I created which is flush with the bottom of the header picture as I intended. Yet in Firefox 2.0, this menu bar is hidden BEHIND the header picture. Does anyone have a solution to this? Thank you. Hi guys, I have a problem with table widths used to arrange content on a website. Why am I not using DIVs? Because it's too time consuming at the moment to convert it over, and my client is not familiar with DIVs and has no time to learn it. So I have to stick to using tables for him to maintain on his own. Here's a quick rundown on my table layout. ----------------------------- |TD1-------------|TD1a****| ------------------ |TD2-------------|********| ------------------ |TD3-------------|********| ------------------ |TD4-------------|********| |Table 2----------|********| ------------------------------ |TD5-------------|********| ------------------------------ That's my attempt to illustrate my layout. I'm using * and - as fillers, the editor removes all the empty spaces... My problem is, TD1 to TD3 and TD5 aligns nicely vertically - they all have the same / correct width. However, TD4 with a table inside is slight shorter in width than it should. About 1 or 2 px. The following shows the screenshots. zoomed in.... I need to get that TD4 with the table inside to have the same width as the others. I have tried removing all BORDER and BORDERCOLOR codes from all the table tags, no use. I tried using both CSS and the table tag WIDTH to control it, still doesn't work. Need suggestions!! Please click here to see my code. It's a little messy... http://www.thienkaiwei.com/index7.html I'm using the developer toolbar for FireFox and I've outlined the tables on the following web page. http://www.carlmumford.me/email Are the tables different sizes? Can someone explain to me why there is a slight change in table size when you outline them? I have the images at 600px wide and the tables are 600px with no padding. Ignore the bottom nested table because that's fine, it's the outline of the bigger tables that are bothering me. They show correctly but they are not quite lined up, is this fine? On another note, how do I get the link colours to display in gmail because they default to the nasty blue colour. I can't get them to display properly, what would you use? I'm setting up a forum page for a friend. I already found the forum and am making it so that it looks consistent with the rest of his website. Another webmaster already built his site, I'm just creating another page that will include a forum. http://goltoof.com/wchr/wchra_mboard.html This is just a test page. You'll find that I'm using iframe to embed the forum page into the webpage. The problem I'm having here is that I want the table I created to stretch to 100% of the webpage so that people won't have to scroll using the main sidebar. You'll see in firefox it only shows part of the page while in ie the forum table doesn't show at all. Please let me know what I'm doing wrong and ask me to elaborate more if my question doesn't make sense to you. Thanks. Can someone take a look at this page: http://www.robotsandcomputers.com/robots/index.htm in both IE and Firefox and tell me why the images in the right hand side of the screen are larger in IE than in Firefox? I have been through the code and I can cannot figure it out.. Thanks Oh, and something else... On the menu at the top of the page. On that page you notice (in Firefox) that the menu spans the entire screen. But if you click on any other link on that menu, then the menu bar is centered. I removed the <p></p> tags in the menu on the first page because in IE they were adding way too much space above and below the menu links. Is there anyway to center those links (like they are on all the other pages) but still have IE display them correctly? I hope that makes sense.... Thanks.... Hello This is my site: http://www.showlistportland.com When viewed in 1280 x 800 it looks perfect. If you view the page in any other size below that, it cuts the page in half. How can I make it so that at least when viewed in a smaller screen size, the ads on the left side don't get cut off? Any help would be much appreciated!!! Thank you!!! Hi, I have the following javascript which basically scrolls to a certain point of a webpage when the page loads up: <script type="text/javascript"> window.onload=function() { scrollTo(0,200); } </script> Now the problem I have is that this code behaves differently based on what screen size monitor you have. As I have a 15 inch screen monitor, all works fine. But if i view the page on a 19inch monitor, it scrolls down to a slightly different point of the page. Is there anyway round this. I am trying to make a generic html page. This page is going to switch between two htm files. For some reason I cannot get the font to increase. I need it to be about 125font size in word. Here is what I have: span class="fontsize100"><Font Color=red>test</font></span> I assume this is incorrect? Hey i am just wondering why text size changes between browsers if you set it at a certain size. I set my text at 11px print, and the size from mozilla -> ie6 changes (gets bigger in ie6) but even greater difference in ie7... is there a way to make them all the same for sure without recoding for each browser? thanks in advance, -uberwalla I am currently having an issue where Firefox allows my images to wrap according to window size but IE puts them one by one down the page instead of putting images side by side according to window size if they will fit. Example is that I have 5 images. 4 of the images are 350pixels X 400pixels and 1 image is 700pixels X 500pixels. I have code that loops through and gets images for each section that is setup. Then I am just displaying the image in 1 line of code which loops through and displays the images for each section. I have 5 sections setup with the five images listed above. My code then displays the section images with links to the sections. <a href="<%= lTemplateFileName %>"><%= (sectionMediaFile != null) ? sectionMediaFile : "" %></a> Firefox puts images side by side and since the 700pixel image will only fit on 1 row it puts that 1 image and then the next row shows 2 images because they will fit on that row. With IE using that code it displays each image 1 by 1 on seperate rows. I want to be able to use 1 piece of code that will allow images to wrap depending if multiple images can fit on that a row. I don't want to limit a <td> to a colspan and create a table out of it. I just want the images to display as many as it can fit on a window size and wrap the next images to the next row and so on and so on. How can I make it so that the end user can choose between three text sizes like is done here http://www.tsn.ca/nhl/story/?id=294191 Thanks in advance BW I want to make changes to the font of the posts of this section: http://foxh0und.tumblr.com/tagged/foxh0undQA I'm really not sure where to find the part for that in the HTML.. what I want to do is change the spacing between each post & have the question in bold and the answer not in bold and smaller font - an example of what I would like to do is in the link below. http://foxh0und.tumblr.com/post/11626236049 any help would be amazing because i feel like it's ruining my whole theme. Hello. I'm back again. This time I have a different problem: Because the text sizes in IE are much smaller than in Firefox, the alignment of certain divs comes out disarranged. Notice that in FF, the big red box's position begins at midpoint of the contact us navigation. But, in IE it begins a big close to the end. I think this is due to the different text sizes. I was wondering if I could use javascript to test which browser is currently being viewed, and base on the browser type it would switch between css to correct the differences? (Sorry for the overly huge images) Also, I'll post the code later. Is there any way that I can set up a page with frames where the frames remain a fixed width and will stay that size even if the browser cannot show them in their entirety? This is a simplified version of what I'm trying to do (with two random sites in the frames for an example) <html> <frameset cols="800, 800"> <frame src="google.com"> <frame src="yahoo.com"> </frameset> </html> How that is working right now is that if you reduce the size of the browser then the frames also reduce in size so that they both remain on the page... I don't want this. I want the frames to remain the fixed width (800) and if the browser is not large enough to display them (<1600), I want it to have a scroll bar along the bottom to scroll further right to view them. I don't really ever use frames though, so I'm not quite sure if there's a command to throw in either frameset or frame tags or if there's something else I need to do. Thanks! Hi, Background: I have a small page that need to be embeded into a bounch of other html pages. Help needed: 1. Please provide the html chunk that I can use to embed the small page in to other html pages. 2. Is there a way of not using iframe? Can I use <Object> or <embed>? How? --------------------------- mba colleges in london hospitality management diploma Some mouses today have horizontal scroll, some call the tilt. It looks something like: http://www.htmlforums.com/attachment...1&d=1242556560 I noticed that many websites they code those horizontal scroll to go to next/prevous page. For example Discuz! forum system has this function. While you browse hundreds or thousands of posts separated into pages, the horizontal scroll can take you to previous page or next page.(not browser back/forward) How do I code like that? Or any examples? I believe in thread titles that get to the point. I have a basic page, when the page loads I want people to see the top of the page for a few seconds while a flash starts to load but then I want the page to scroll down a bit so the visitor can see the flash load progress status. I just want code that I can copy into my page. I don't have access to the flash code. Greg (the page under design) www.mytcanada.com/designer.html I have a programmer in the US who starts pages for me and then I much around with them until it's looks like I want. He helps me when I get stuck but he's on holidays. Any help would be great. Below are the two sites I will use to explain my problem. For reference, I used Mozilla Firefox 3.08 and Google Chrome 1.0.154.53 in my tests. Example 1: http://www.irishbyname.com/example1.htm Example 2: http://www.irishbyname.com/example2.htm When browsing the site in a browser other than Internet Explorer, example 1 and example 2 center to different locations on the page. In example 1, I set the height of the content area to be 200 px tall. In example 2, I set the height of the content area to be 500 px tall. When I have example 1 open in one tab and example 2 open in another, I can alternate between the two tabs and see a visual difference in alignment. The HTML code on both pages is exactly identical with the exception of the height of the content area. Can anyone tell me why the horizontal page center changes based on the height of the page? Can anyone tell me how to change my HTML to make certain the page centers correctly no matter how tall the page is? Thanks for your help in advance. Not even sure what to call this actually... I received this message from a friend whose site I just put up. ---------------------------- When you click on say the Home Page, and then you click on something else then go back to the prvious page, it apparently displays the previous page on the home page for example. I was not able to recreate this on my computer, but apparently, [another] web developer said this is a fairly common problem. Do you know what he is referring to, and can it be fixed? ---------------------------- Here's the site in question. Nothing fancy, just individual HTML pages. http://www.soundadviceht.com/index.html I gotta admit, I have no earthly clue what he's talking about, unless he's relaying the message wrong? Any ideas what he's talking about? |