Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4
  1. #1
    Junior Member
    Join Date
    Oct 2003
    Posts
    8
    Member #
    3727
    Whats up everyone, im having a little trouble with something in CSS, so if anyone can offer some advise, I would really appriciate it..

    Background Info:

    I made all the graphics for my site in photoshop, bumped over to image ready and sliced it up for roll-overs and whatnot (all the slice information was exported in css code, which I then transfered to a linked style sheet), then imported it all into dreamweaver for content. When I started this site, I decided I would use css (for the first time) and so far so good.

    The Problem:

    I'm trying to make the site fit perfectly in an 800x600 browser (dont know why) and i've done that, but im trying to use css to center the website perfectly in the middle of the screen for any other resolution better than 800x600. I use 1600x1200 so, for me, I would like the site to appear perfectly center vertically and horizontally on my screen. However, When I resize my browser window, I would like the site to follow along with it to stay center, and when I get to the point where the browser window is smaller then the site, I would like for the site to stop moving when it hits the top and left of the browser limits - so if I were to keep collapsing the window, eventually content on the bottom and right would require me to scroll.

    Other Variables:

    I am staying clear of tables for the first time as well, so although I know I could throw all this in a table and do it, I would like it to be fully governed by my css document. I read an article where someone was talking about this scenerio, but the end result was how great css was because it could do this and then he went on to talk about other things css can do, and never talked about the centering issue. Ive searched this forum too but didn't find what I was looking for.

    I do not have the site up yet as I am on the first page of it and Im trying to take care of it now before I go on to anything else. Using css though, I know that so long as all my pages are linked to the external document, one change would affect the whole site, which is what I want to be able to do, but I cant get this one centering issue figured out.

    again, if any css experts out there can lend some advise.. I would really appriciate it. Thanks in advance.

    - J

  2.  

  3. #2
    Junior Member
    Join Date
    Oct 2003
    Posts
    8
    Member #
    3727
    Code

    By the way, this is the code I have for the body in the css document:

    body {
    position: relative;
    top: 20%;
    left: 25%;
    margin: 0px;
    padding: 0px;
    right: 0px;
    bottom: 0px;
    }

    With this code, the website is centered perfectly in my maximized browser like I wanted, but when i go to resize is when problems start. I know why though - I know that with the above code, no matter how I size my browser, the content will always be 25% and 20% away from the browser limits top and left.

    So as per my original question, how would I adapt it so its centered maximized, and haults at the top and left on the browser limits as its sized smaller, still filling up the window?

    Thanks

  4. #3
    Junior Member
    Join Date
    Oct 2003
    Posts
    17
    Member #
    3467
    Try this:

    body {
    margin-top: 20%;
    margin-right: 25%;
    margin-bottom: 20%;
    margin-left: 25%;
    position: relative;
    }

    Or you can make it even simpler:

    body {
    margin: 25%;
    position: relative;
    }

  5. #4
    Junior Member
    Join Date
    Oct 2003
    Posts
    8
    Member #
    3727
    Thanks, but no dice. That actually sends the site more towards the bottom of the screen, but the sizing still doesnt work. However I noticed that when I take out the DTD type in the Transitional line (im using strict) it totally ignores the margin values. Like I said, im new to this, lol.

    www.n-sane.net is a perfect example of what im trying to accomplish - except the author of that site used tables, im trying to do that without tables.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 04:50 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com