...

View Full Version : How can I center this code in a blog?



L1D3N
04-27-2011, 07:43 PM
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>

teedoff
04-27-2011, 07:45 PM
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.

L1D3N
04-27-2011, 08:01 PM
Thank you for your help!
Sorry, i'm a noob to this stuff... don't understand.

teedoff
04-27-2011, 08:18 PM
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:


#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.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum