Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Mar 2011
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Question How can I center this code in a blog?

    I am trying to center this on a blog. It's on the left side on the page now but I've tried almost everything to get it to be centered. Why don't they just have a float:center;?!
    Any suggestions? Much appreciated!

    <html>
    <head>
    <style type="text/css">
    ul#likes {
    list-style-type: none;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    }

    li.like_post {
    /* Should match the width specified in the Likes tag */
    width: 150px;
    padding: 0 40px 0 0;
    float: left;
    }

    li.like_post img {
    max-width: 100%;
    }

    li.like_post blockquote {
    margin: 0;
    padding: 0 0 0 10px;
    border-left: 1px solid #eee;
    }

    li.like_post ol,
    li.like_post ul {
    margin: 0 0 0 15px;
    padding: 0;
    }

    li.like_post .like_link a {
    font-weight: bold;
    }

    li.like_post .like_title {
    font-weight: bold;
    }

    li.like_post .post_info_bottom {
    margin: 10px 0 0 0;
    display: block !important;
    }
    </style>
    </head>
    <body>
    ...

    {block:Likes}
    <div id="likes_container">
    <h2>Stuff I like</h2>

    {Likes limit="5" summarize="100" width="150"}

    <a href="http://www.tumblr.com/liked/by/{Name}">
    See more stuff I like
    </a>
    </div>
    {/block:Likes}
    </body>
    </html>

  • #2
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,335
    Thanks
    5
    Thanked 363 Times in 360 Posts
    To center a page element, it needs to have a specified width less than its containing element, set that elements margin to "0 auto" and have a valid doctype.
    Teed

  • Users who have thanked teedoff for this post:

    L1D3N (04-27-2011)

  • #3
    New to the CF scene
    Join Date
    Mar 2011
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thank you for your help!
    Sorry, i'm a noob to this stuff... don't understand.

  • #4
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,335
    Thanks
    5
    Thanked 363 Times in 360 Posts
    Whatever element you want centered...I'm not sure which one it is you're talking about, but for example you wanted a div called "text" centered within its containing element...a div called "content".

    If content is the div wrapping ALL of your page including everything inside your opening and closing body tags, then you could do something like this:

    Code:
    #text {margin: 0 auto;
                        width: 200px;}
    This tells the div with id of "text" to center inside its wider "content" element. margin 0 auto is shorthand for:
    margin: 0 auto 0 auto;

    0 and 0 being the top and bottom margins, auto being left and right.
    Teed

  • Users who have thanked teedoff for this post:

    L1D3N (04-27-2011)


  •  

    Posting Permissions

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