SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Guru DeNasio's Avatar
    Join Date
    May 2001
    Posts
    830
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need some help with centering

    Hello,

    I have created a few blocks using css but I can't seem to center them on the page. Take a look at the testpage here:

    http://www.ballot-box.net/test.html

    Take a look at the code. I can only float to the right or float to the left. Too bad there isn't a float center command! Any one knows how I can center these boxes using css?
    Ballot-Box.net - free polls for webmasters
    FormLog.com - free form processor

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,622
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    There actually is a fake float center in this quiz.

    However that's only trickery .

    You can center floats via something like this?
    http://pmob.co.uk/pob/centred-float.htm
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #3
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,200
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    The #setofboxes div is not centering because it doesn't have a set width (so it's centering at 100% width...)

    Rather than use <center> (which is out of date) the best way to center items is ike this:

    Code:
    #setofboxes {width: 540px; margin: 0 auto;}
    Auto left and right margins centers an element with set width.

  4. #4
    SitePoint Guru DeNasio's Avatar
    Join Date
    May 2001
    Posts
    830
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    Code:
    #setofboxes {width: 540px; margin: 0 auto;}
    Yep, that's it. Thank you very much!!
    Ballot-Box.net - free polls for webmasters
    FormLog.com - free form processor

  5. #5
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,200
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by DeNasio View Post
    Yep, that's it. Thank you very much!!
    Just note that I make the div wider than necessary to account for the default margins and paddings, which it would be good to tidy up so that the content is tryly centered.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •