Solved

Center Web Page Not Working

Posted on 2011-02-12
5
415 Views
Last Modified: 2012-05-11
An update page I am working on  is at http://www.dciscancer.com/index2011.php

In Code View you can see:
<div id="Centered">
at the top of the body.
I close it just above  </body>

The tag is in the linked .css file a reads as follows:
Centered {
      position: relative;
      margin-left: 100px;
      margin-right: auto;
      margin-top: 0;
      margin-bottom: 0;
      width: 1024 px;
}

I use this many other websites to center the page on the browser screen.
It works at http://www.thebicyclesite.com and http://www.liccsc.org, for example.
Here it is not doing anything and I cannot figure out why.
0
Comment
Question by:glenn_1984
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
5 Comments
 
LVL 16

Assisted Solution

by:SSupreme
SSupreme earned 200 total points
ID: 34879494
Add to your css this code instead Centered:
#Centered {
    margin: 0 auto;
    position: relative;
    width: 900px;
}

Open in new window

0
 
LVL 20

Accepted Solution

by:
thehagman earned 300 total points
ID: 34879676
So before you merely edit the margin property, take a close look at SSupreme's complete CSS code: You used "Centered" instead of "#Centered", which would apply to a (ficticious) tag <Centered>...</Centered>
0
 
LVL 16

Author Comment

by:glenn_1984
ID: 34879896
I figured it was a stupid error.

I added the # to Centered...no idea why, in a long .css file I did not notice that :)

The margin: 0 auto;  has no effect.  I tested with and without.

Thanks.
0
 
LVL 16

Expert Comment

by:SSupreme
ID: 34880365
If you tested it without the width, then there is no place for margins to exist, except 0 margins. Please follow the instruction next time.
0
 
LVL 16

Author Comment

by:glenn_1984
ID: 34880527
I DID  use the width. What I did not use was  margin: 0 auto;

It is now running live at http://www.dciscancer.com.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight! There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question