|
HTML - Web Page Not Remaining Dead Centre
Hello,
I have a website I am working on and I have almost finished and have just noticed that when I use Chrome or Opera the different pages on my website shift 20 pixels or so to the left. That is some jump left and some don't. Under IE8 this is o.k. Having spent a few hours trying to work out the difference( I assumed this would be easy ) I have discovered that sometimes by adding a <p>Hello World</P> into the centre DIV causes the webpage to fix itself. I have no styling on the P other than to change the colour and can't work out what is causing it. I was trying to make the website HMTML 4.01 strict to avoid these inter-browser problems using but this one has caught me out. I am new to this FORUM and so I am not sure of the correct way of doing this. So I am happy to post code here or if someone wants to have a look at the website its he http://www.sharpcoders.co.uk/index.htm Simple clicking on HOME and then the tab marked "Windows Apps" will show the shifting I am talking about. Thanks for any support or suggestions anyone can give me. Regards, Similar TutorialsI have a many pages of XHTML-code and on those pages there are dozens of links to different files. Sometimes these files can change and it is very hard to find all the places where there are links to a certain file. Is there a program or something else out there that could be used? Preferably a free one, but it does not have to be. Thanks. Could you please only recommend a program that you have used or heard at least heard of from someone. This program would also have to work for offline pages that are stored on my hard drive. My image map worked fine until today. I just upgraded to firefox 3, but it's borken in IE also. Are image maps history? This exact code does not work for me now.. 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=iso-8859-1" /> <title>Untitled Document</title> </head> <body> <map id="jugmap" name="jugmap" > <area shape="rect" coords="9,21,55,42" alt="home" title="home" href="?display="> <area shape="rect" coords="10,43,110,63" alt="instruments" title="instruments" href="?display=instruments&slideshow=instruments"> <area shape="rect" coords="12,66,127,86" alt="items for sale" title="items for sale" href="?display=forsale"> <area shape="rect" coords="11,89,143,113" alt="upcoming events" title="upcoming events" href="?display=events"> <area shape="rect" coords="11,113,128,131" alt="custom builds" title="custom builds" href="?display=custom_builds"> <area shape="rect" coords="10,135,110,157" alt="mailing list" title="mailing list" href="?display=mailing_list"> <area shape="rect" coords="10,159,71,178" alt="contact" title="contact" href="?display=contact"> <area shape="rect" coords="11,180,54,201" alt="links" title="links" href="?display=links"> </map> <img src="images/menu.jpg" width="170" border="0" usemap="jugmap" > </body> </html> Can someone tell me why the "View Cart/Checkout" button on this page works in Mozilla but not IE7? http://www.usautomated.com/catalog/catalog.asp Thanks! Hello! I'm fairly new to coding overall, let alone web design in itself but my problem is simple. Apologies in advance for the horrible diagrams below! The solution however, may not be so simple... But isn't that what it's all about? I'm looking for help or direction towards help for this slight task I have a page with tables containing images which in effect looks like this --- I need to (highly preferably without altering the code inside the tables themselves) embed a video (think YouTube) over the top of all the action taking place there, dead in the center of the page like this --- I know very well that this is possible as I'm sure I've seen this technique used many times before, but the question is how do I go about making it happen? Any help would be MASSIVELY appreciated. Thanks in advance. The website I am curently working on http://www.pancodistribution.com/Pro...kle/Trolls.htm is required to have a frame layout so I have used css to do this however when scrolling in IE7 there is a dead zone that the scroll wheel of the mouse will not work in this dead zone is anyplace with no content I.e:text or pictures does anyone know why? I can't have IE space my cols/row as expected: I want that my cols/rows have an exact width/height, with the final col/row take the remaining space of the table (which I don't know exactly). This works well with Chrome and FF, but IE keeps spreading my cols/rows along the whole space as if the dimentsions I defined were minimum dimensions as opposed to exact dimensions. eg: HTML Code: <table><tr> <td width="100">100 desired</td> <td width="100">100 desired</td> <td>remaining space</td> </tr></table> any help? I suspect this is a very simple question but for the life of me I cannot figure this out. I have tried almost everything but I cannot get an image to centre widthwise. Here is the page: http://outdoorphotographycanada.com/ I am trying to centre the image on the left side of the page which is our Forum banner (picture of an eagle). Here is the code for that piece: <td width="189" rowspan="4" valign="top" bgcolor="#fba71b"><br /> <p><a href="http://www.outdoorphotographycanada.com/ccount/click.php?id=2" target="_blank" onMouseover="return hidestatus()"> <img src="http://www.outdoorphotographycanada.com/images/site_pics/OPCForum.jpg" alt="Forum" width="187" height="600" border="0" /></a></p></td> I have tried <center> , <div align="center"> and also various valign entries but no luck. I am working in Dreamweaver and using a template. My browser is IE 6.0 and Firefox 2.0.0.15 Does anyone know how I can do this? Thanks, Dave I need to create a page like the image its really simple but i just cant get my divs working. Please help me im tearing no ripping my hair out. Many thanks in advance Matthew CSS body { background-color:#F0F; margin: 0; } #wrapper { width: 700px; height: 100%; min-height: 100%; position: relative; margin: 0 auto; background-color: #CCC; } #main { left: 0; position: relative; top: 50%; height: 500px; width:700px; background-color: #666; } #footer { height: 50px; width:500px; bottom: 0; position: absolute; background-color: #CCC; } HTML <!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; charset=UTF-8" /> <title>2010</title> <link href="test.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="wrapper"> <div id="main"><p>container</p></div> <div id="footer"><p>footer</p></div> </div> </body> </html> Hi, I'm a complete novice at html - am building a site from a wordpress template and want to centre the image in my header but it seems to be automatically pushing it to the right. At the moment i have: <div id="title"><center><a href="http://www.bar-23.co.uk"><img src="http://www.bar-23.co.uk/finallogo2.png"></center></img></a></div> Is this all wrong?!! Hi All I am working on a new and very very simple site for myself and have been asking friends to check it as i am going along on my screen res the site is fine but on anyone with hugh monitor resolutions they are getting the home page of the site showing up tiny in the top left corner... and all pages are showing with huge white space below is there an easy way for me to make the site show up in the middle of the browser no matter the reolution? i dont mind if theres white space around the site i just dont want it all at the bottom or for the site to be stuck up in a corner.. i dont just want it centred at the top of the screen either I hope this makes sense? appreciate any help.. thanks http://www.steverobertson.co.uk Please could anyone help me. Adding items to the left column moves the centre column, increasing the space betweeen centre column text and the header. Could anyone help me with this. Here is the detail. Quote: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Web Shop</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" type="text/css" href="default.css" title="default"/> </head> <body> <div id="WholePage"> <div id="Inner"> <div id="Container"> <div id="Head"> <div id="Head_left"> <div id="Leaf_top"></div> <div id="Leaf_bottom"> <a class="registration" href="">REGISTRATION</a> <a class="log-in" ">LOG IN</a> </div> </div> <div id="Head_right"> <div id="Logo"> <div id="Name"><span class="blue">A</span><span>dvance </span> <span class="blue">P</span><span>rofessional</span> </div> <div id="Informations">Laundry | Catering | Auto Dosing Equipment </div> </div> <div id="Top_menu"> <a class="kart" href=""><span>KART</span></a> <a class="orders" href=""><span>ORDERS</span></a> <a class="contact" href=""><span>CONTACT</span></a> </div> </div> </div> <div id="CentralPart"> <div id="LeftPart"> <div id="Menu"> <div id="Menu_header"> <div class="menu_header_left"> <span class="menu_text">LAUNDRY PRODUCTS</span> </div> <div class="menu_header_right"> </div> </div> <div id="Menu_content"> <a class="menu_item" href=""><span>Professional Powder </span></a><br/> <a class="menu_item2" href=""><span>Non- Biological</span></a><br/> <a class="menu_item2" href=""><span>Biological</span></a><br/> <a class="menu_item" href=""><span>Professional Liquids</span></a><br/> <a class="menu_item2" href=""><span>Biological</span></a><br/> <a class="menu_item2" href="<span>Non-Biological</span></a><br/><a class="menu_item" href=""><span>Fabric Conditioners</span></a><br/> <a class="menu_item2" href=""><span>Disinfecting</span></a><br/> <a class="menu_item2" href=""><span>Peach Liquid</span></a><br/> <a class="menu_item" href=""><span>Destainers</span></a><br/> <a class="menu_item" href=""><span>Oxy Boost</span></a><br/> </div> </div> <div id="Menu"> <div id="Menu_header"> <div class="menu_header_left"> <span class="menu_text">CATERING PRODUCTS</span> </div> <div class="menu_header_right"> </div> </div> <div id="Menu_content"> <a class="menu_item""><span>Warewashing</span></a><br/> <a class="menu_item2" href=""><span>Auto Dishwash Liquid</span></a><br/> <a class="menu_item2" href=""><span>Biological</span></a><br/> <a class="menu_item2" href=""><span>Dish Wash Powder</span></a><br/> <a class="menu_item2" href=""><span>Dish Wash Tablets</span></a><br/> <a class="menu_item2" href=""><span>Rinse Aid</span></a><br/> <a class="menu_item2" href=""><span>Tanin Stain Remover</span></a><br/> <div id="Menu_content"> <a class="menu_item" "><span>Glass Washing</span></a><br/> <a class="menu_item2" href=""><span>Auto Glasswash</span></a><br/> <a class="menu_item2" href=""><span>Rinse Aid-Glasswash</span></a><br/> <a class="menu_item2" href=""><span>Glass Renovating Powder</span></a><br/> <a class="menu_item2" href=""><span>.....</span></a><br/> <a class="menu_item2" href=""><span>Rinse Aid</span></a><br/> <div id="Poll"> <div id="Poll_header"> <div class="menu_header_left"> <span class="menu_text">SERVICE</span> </div> <div class="menu_header_right"> </div> </div> <div id="Poll_content"> <span class="poll_question">Laundry Systems</span><br/> <a class="menu_item2" href=""><span>1111111</span></a><br/> <a class="menu_item2" href=""><span>2222222</span></a><br/> </div> <div id="Poll_content"> <span class="poll_question">Warewashing Systems</span><br/><a class="menu_item2" href=""><span>3333333</span></a><br/> <a class="menu_item2" href=""><span>44444</span></a><br/> <a class="menu_item2" href=""><span>55555</span></a><br/> <a class="poll_unswer" href=""><span>Laundry Dispensers</span></a><br/> <a class="poll_unswer" href=""><span>Dishwash Dispensers</span></a><br/> </div> </div> <div id="Banner"> <img src="img/banner.jpg" alt="" /> </div> </div> <div id="RightPart"> <div id="Page"> <div id="Page_header"> <h1>Save money by buying direct...</h1> <table> <tr> <td class="page_header_img"><img src="img/basket.gif" alt="" /></td> <td class="page_header_text"><p>Buy on-line direct from us. No middlemen and achive massive savings.</p></td> <td class="page_header_img"><img src="img/idea.gif" alt="" /></td> <td class="page_header_text"><p>All prices on our website include delivery. No hidden charges.</p></td> </tr> <tr> <td class="page_header_img"><img src="img/car.gif" alt="" /></td> <td class="page_header_text"><p>Should you have any queries or need some techinical advice, we are on hand. Just send us an email.</p></td> <td class="page_header_img"><img src="img/envelope.gif" alt="" /></td> <td class="page_header_text"><p>Donec at justo ac ipsum laoreet dapibus. Vivamus lacinia. Suspendisse ipsum. Morbi vitae nulla. In hac habitasse platea dictumst.</p></td> </tr> </table> </div> <div id="Page_top"> <p> Introductory Offer...Buy any 100 litres Get any 20 litres FREE<br/> Great savings every month <a href="http://www.free-css.com/">libero,</a> <a href="">vestibulum ut,</a> <a href="">venenatis ac,</a> <a href="">interdum quis, mi.</a><br/> Donec at justo ac ipsum laoreet <a href="">dapibus</a><br/> <a href="http://www.free-css.com/">1</a> 2 3 .... 11 12 13<br/> </p> </div> <div id="Page_center"> <table> <tr> <td class="page_center_button"><a class="page_center_buy" href="http://www.free-css.com/"><span>buy</span></a><a class="page_center_info" href=""><span>more-info</span></a> </td> <td class="page_center_content"><div class="page_center_text"> <span class="blue2">Lorem ipsum dolor</span><br/> <span class="gray">Donec at: justo ac</span><br/> <span class="gray">Cras ut: ligula nec</span><br/> <br/> <span class="green">Price: $156</span><br/> </div></td> <td class="page_center_img"> </td> <td class="page_center_button"> </td> <td class="page_center_content"></td> <td class="page_center_img2" > </td> </tr> <tr> <td class="page_center_button"><a class="page_center_buy" href="http://www.free-css.com/"><span>buy</span></a><a class="page_center_info" href=""><span>more-info</span></a> </td> <td class="page_center_content"><div class="page_center_text"> <span class="blue2">Lorem ipsum dolor</span><br/> <span class="gray">Donec at: justo ac</span><br/> <span class="gray">Cras ut: ligula nec</span><br/> <br/> <span class="green">Price: $156</span><br/> </div></td> <td class="page_center_img" > </td> <td class="page_center_button"> </td> <td class="page_center_content"></td> <td class="page_center_img2" > </td> </tr> </table> </div> </div> </div> <div class="cleaner"></div> </div> <div id="Bottom"> <p class="down">Copyright © 2007 <a href="">Design by: Sunlight webdesign</a> </p> <div class="down2"> <p> <a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml11" alt="Valid XHTML 1.1" height="31" width="88" /></a> </p> </div> </div> </div> </div> </div> </body> </html> Thanks in anticipation...Any other comments welcome to this novice. I'm using firework and dreamweaver, but i need to expand some side bar images in html in a table so client can input their own copy so it expands vertically without compromising the design. I need to use HTML code not CSS What code can i use to vertical align the background image in a table? Presently i have this working... <td rowspan="9" background="expansion_images/right_001_r2_c5 copy.png"> </td> HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Brew Records - Leeds Independent label</title> </head> <img src="images/logo/brew%20logo%20black.jpg" align="absmiddle"> <body> </html> when i put in align="right" it goes to the far right but absmiddle doesn't make it go in the middle of the page. driving mer nuts i'm certain its correct This is issue has been bugging me forever! Plus, I'm sure you guys are sick of seeing this topic come up. I don't know why but I cannot get my flash mp3 player to load properly into an iframe. Here is the site: http://duffyartwork.com. All I need is for the mp3 is to simply stop reloading everytime a user browses to a different page on the site so the song stops refreshing. Can someone please just give me a straight forward answer for this. I hate to beat a dead horse but it would be so awesome not to have to worry about this anymore. Ive attached the source code and marked the spot where I believe the code should go... Thanks a million in advance! Hi, My website sits of center on the iphone's. I think logic tells me that its something to do with the background image. http://pjm.co.uk.uksite4.yourwebserv...splay&PageID=5 Please can someone help as I've been stuck on this for AGGGGEEEEESSS Thanks alot Joe Hi I'm designing a simple website in NVU, but although it displays correctly in NVU and Firefox, for some reason the tables aren't centred in Internet Explorer (they stay on the left side of the browser). The site is at www.saturdaynightmusical.com Any tips on why this is displaying differently in IE would be greatly appreciated! Many thanks for your time. Hi there, Hoping I can explain my situation without having to post an example. I have a logo, which I want to be centred... Easy enough. However, on the left of the text for the logo, there is an image, which kind of overlaps the text (imagine someone holding there arm out straight across top of text, and the person is fat lol). My predicament is this... If I leave the person as a part of the original logo, the font isn't centred and does look kinda odd with the rest of the page. So what I'd like to do is have the text centred, and have the person to the left, without affecting the centre of the text. Although I will need the person on the left to be close enough to the text to look like the complete logo. Also, might be worth me mentioning, the person on the left is taller than the font, and so I'd like the text to be in the midle of them (say waist height). Anyone understand me or am I gonna have to post up an example? lol Cheers Ps, I think I've done something similar in XML and CSS using just text, but never with an image, and don't really remember it too well anyway. 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. |
|||||||