HTML - Centering Wide Web Page
Hi,
I have a webpage which is 1740px long however, i would like it so the amount of background on both sides the viewer sees depends on the viewers resolution. Here is the address to the site: http://luminaskincare.ca/new/luminarightsize.html how can I make the site centered with no horizontal scroll? thanks in advance Similar TutorialsI was put in charge of changing our website with no html knowledge. Hoping someone on here can help. The right margin on all of our pages is too wide. I'd like it to look more uniform. Any idea where I need to change this? http://www.sgccc.com/index.html How wide should you make your page/site? Since most have different size monitors and settings, how wide should your page be so it's not tiny on one user's monitor, and not too big on another? Hi there, my pages are loading wide and then jumpimg down to the size the table is set to be. Does anyone know how i can specify the width of content either through css or the div tag? Thanks in advance! Hello, I've put the Code: <div align="center"> below the Code: <body> tag and closed it with the Code: </div> before the Code: </body> tag. The page doesn't center at all. Is looking fine in 1024x768 but in any bigger resolution, the page is aligned to the left. The page that I am talking for is this. Any idea? I know some HTML but not a lot. I'm working on an HTML version of my companies website (it's currently in flash.) I'm happy with the design right now but I can'ty seem to find a way to center all of the contents of the page. Any help would be very much appreciated. http://www.ars-guardian.com/htmlhome.html Okay, so me andd my friend are making a website, http://bitememanga.com/, and she designed a template for uor site that we can't center. I've tried putting <center> tags around the entire body, and around every div, but it won't work for some reason. I really need to center this whole page so it looks decent on any computer resolution. Thanks! The code is: <html> <title>Bite Me - The online shonen-ai manga novel/book - gay vampires, fantasy, anime and so much more.</title> <center> <body> <div class="bg" style="position: absolute; left:300px top:0px; width:800px; height:750px; overflow: hidden;"> <img src="http://i41.tinypic.com/nyfe3s.jpg"> </div> <div class="content" style="position: absolute; top:250px; width:500px; height:200px; overflow: auto;"><font color=white> Welcome to Bite Me, the online shonen ai manga about Aku the vampire, and his love, Haru.<br> At the moment, we do not have any manga posted.<br> A few things need to happen before anythings posted.<br> If you have any questions,suggestions,or comments, you can contact us at bitememanga@hotmail.com<br> And remember to keep checking back every few days to see if we have any updates! </font> </div> </body> </center> </html> Nevermind....... Ive had this problem where when i create a page and I view it on my computer, it looks fine and centered. But when i access my site from another computer with a different sized monitor, it looks a lot different and uncentered. How do I get my page to look the same on every computer no matter the size? Thank You. I just noticed that the site I coded is not centered but is aligned to the left on resolutions larger than 1024x768. Is there a way to fix this? Here is the css for the main div which has all the content. #container { position:absolute; left:0px; top:0px; width:1002px; height:auto; margin:0px auto; border:0; padding:0; Hi All, I have a problem with centering a page to the screen on a new site. The page is 945px wide, and is fine in IE. But in both Firefox and Safari the page is moved to the left of the screen. Does anyone have an idea of what I have done wrong here? Here is a link to the page:- Website I have this question, I am under the impression(?) that browser settings change with various pc and different browsers, but the most simple question of all cannot be found anywhere and the tech support of my domain hosting cannot assist, as their product for developing webpages is currently in beta testing. IS there a code..any code, that centers the ENTIRE website after it is placed? using <center>mywebsitehere</center> does not work, and tables were not used at all in setting this up, in fact I have no idea how to use tables. When you are working in your files and setting up your page for publishing, there is no area for margins, page indents, size of viewing area, nothing. I have manually recoding the existing files and they all default "left" after saving/publishing. Any ideas or help appreciated. The web url is www.yourock24.com. I view it as alot of black area to the right and cannot correct this by myself. Thanks in advance for assistance! Hi all, I'm a totally new user to HTML and CSS. I hope i could get some simple and clear advices from you guys. I create this website using manual positioning. Here's the link ---> www.danielgohdesign.com I would like my site to be in the center for all browser. What should i do? Thanks, Dan I believe the problem is that the fact that the pictures are using an absolute position. Not sure though. I have tried about 4 or 5 different thing to fix this to no avail. I will copy in the code for you to see. I do not have this running on a server for everyone to load but it is not much code. Any help would be greatly appreciated. Thansk, Dano HTML Code: <html> <head> <title>Official Site of Premier Security Group, Inc.</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> .centerContainer { margin: 0 auto; } body { background-image:url(images/bkgd2.png) } #Table_01 { position:absolute; left:0px; top:0px; width:800px; height:1200px; } #PSindex-01 { position:absolute; left:0px; top:0px; width:800px; height:69px; } #PSindex-02 { position:absolute; left:0px; top:69px; width:20px; height:174px; } #PSindex-03 { position:absolute; left:20px; top:69px; width:760px; height:174px; } #PSindex-04 { position:absolute; left:780px; top:69px; width:20px; height:174px; } #PSindex-05 { position:absolute; left:0px; top:243px; width:800px; height:13px; } #PSindex-06 { position:absolute; left:0px; top:256px; width:20px; height:35px; } #PSindex-07 { position:absolute; left:20px; top:256px; width:126px; height:35px; } #PSindex-08 { position:absolute; left:146px; top:256px; width:129px; height:35px; } #PSindex-09 { position:absolute; left:275px; top:256px; width:125px; height:35px; } #PSindex-10 { position:absolute; left:400px; top:256px; width:1px; height:944px; } #PSindex-11 { position:absolute; left:401px; top:256px; width:123px; height:35px; } #PSindex-12 { position:absolute; left:524px; top:256px; width:130px; height:35px; } #PSindex-13 { position:absolute; left:654px; top:256px; width:126px; height:35px; } #PSindex-14 { position:absolute; left:780px; top:256px; width:20px; height:35px; } #PSindex-15 { position:absolute; left:0px; top:291px; width:400px; height:909px; } #PSindex-16 { position:absolute; left:401px; top:291px; width:399px; height:909px; } </style> </head> <body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;"> <div class="centerContainer"> <div> <div id="Table_01"> <div id="PSindex-01"> <img src="images/PSindex_01.png" width="800" height="69" alt=""> </div> <div id="PSindex-02"> <img src="images/PSindex_02.png" width="20" height="174" alt=""> </div> <div id="PSindex-03"> <img src="images/PSindex_03.png" width="760" height="174" alt=""> </div> <div id="PSindex-04"> <img src="images/PSindex_04.png" width="20" height="174" alt=""> </div> <div id="PSindex-05"> <img src="images/PSindex_05.png" width="800" height="13" alt=""> </div> <div id="PSindex-06"> <img src="images/PSindex_06.png" width="20" height="35" alt=""> </div> <div id="PSindex-07"> <img src="images/PSindex_07.png" width="126" height="35" alt=""> </div> <div id="PSindex-08"> <img src="images/PSindex_08.png" width="129" height="35" alt=""> </div> <div id="PSindex-09"> <img src="images/PSindex_09.png" width="125" height="35" alt=""> </div> <div id="PSindex-10"> <img src="images/PSindex_10.png" width="1" height="944" alt=""> </div> <div id="PSindex-11"> <img src="images/PSindex_11.png" width="123" height="35" alt=""> </div> <div id="PSindex-12"> <img src="images/PSindex_12.png" width="130" height="35" alt=""> </div> <div id="PSindex-13"> <img src="images/PSindex_13.png" width="126" height="35" alt=""> </div> <div id="PSindex-14"> <img src="images/PSindex_14.png" width="20" height="35" alt=""> </div> <div id="PSindex-15"> <img src="images/PSindex_15.png" width="400" height="909" alt=""> </div> <div id="PSindex-16"> <img src="images/PSindex_16.png" width="399" height="909" alt=""> </div> </div> </div> </div> </body> </html> Hi. I can't figure out how to have all the tables on my site aligned to the centre yet have the text in them aligned to the left. In other words I want 2 margins either side of the central body of my site. How can I do this? Thanks. Hello, Mozilla Firefox is doing some weird things to the content of my website (you can see it at http://www.mm-theory.com). What it does is, every so often, it widens some of the content of the page so that it spans from the very left edge of the table cell it's in to the very right edge. A quick refresh usually fixes the problem, but I'm wondering why it does this in the first place. Here's a few screen captures that shows the problem: Wide abstract: Normal abstract: The captures were taken from http://www.mm-theory.com/god/god.htm I really doubt it's the code for the abstract since refreshing solves the problem, but here it is anyway: Code: </td></tr> <tr><td class="abstract" colspan=2> <center> <table class="abstract" cellpadding=10 cellspacing=0> <tr><td> <!-- #include file="../includes/god.abs.inc" --> </td></tr> </table> <br><br> </center> </td></tr> The file god.abs.inc is a plain text file with nothing but text in it (i.e. no code). I'm thinking it might have something to do with how I close the body of the page since it seems to have to do with not completing properly. Here's the code for that: Code: ... </td></tr> </table> </body> </html> I only encounter this problem in Firefox. Any guesses as to why? I have an html file which applies a css file to show a table. There is a banner at the top, and the main stuff on the page is in a div which is set to the width of the banner. However, I need to show some tables, and in some cases these will be wider than the banner. This is fine in IE (I'm told that it's really a bug, in that it ignores the standards and just whacks the table onto the page anyway), but in Firefox, it shows as much of the table as it can fit into the div, and then just chops the rest off. How can I get it to show the whole table? Thanks! Hi all, I have a site to show some pictures, the only problem is some are landscape and some are portarit. At the moment I am putting the portrait thumbs onto a landscape black background, but I know this is a bodge. How can I have all the thumbs sit nicely next to each other regardless of their shape? Here is the site; www.streetpicture.co.uk Any help would be really appreciated. Many thanks, Hello, okay, so i was thinking about redesigning my site because i never really have done so before. but as i was thinking, i was thinking it would be nice to be able to fit more stuff across the screen width wise.... right now my website has like 750px width... and i was wondering if i increased it some, would the majority of the people not have a problem viewing it? and if so, how many pixels wide do u think i could go before its too wide... i have my screen resolution said at 1280x1024... does anybody know what the majority of people set their screen resolutions to? any help would be great..thanks.. Hey Every one im new on this so i really need help i designed a website but i cant figure out how to center the page when its minimized and when it becomes maximized if no one understands what im talkin about take a look at this website and you will understand im using Dreamweaver Mx 2004 i need help how to make it so it is centerd when the window is minimized and then it becomes centerd when the window is maximized!!!! this is the website im talking about www.parikiaki.net please some help me it will be very much appreciated Thank You Pavzz how can i center the nav on this page? http://fantasyfootball.pzproductions.com/testing |