Centering Ordered and Non-Ordered Lists ?

If your theme has a built-in custom CSS option, use it; otherwise, get a custom CSS plugin and put:

ol, ul {
margin: 0 auto 1.5em;
display: block;
width: 50%;
}

Another option is to put this instead:

ol, ul {
text-align: center;
list-style-position: inside;
}

The first code will put the list items into a block and center the block on the page, so the list bullets will still line up properly. The second code will center the text of each individual list item, so the list bullets will not line up.

Mr. Cottontail,

That didn’t work and messed up my Nav Menu Items by making some of them become transparent (or disappear). So what I did was create two columns using this plugin: Column Shortcodes . I might be able to live with the results, even though the two columns are left-justified (I get the same results using that plugin on most of my static pages.

@shapshifter, if you only want your change to apply to the content area, you can use a more specific selector like this. This limits the changes to only the entry content area.

.entry-content ol, .entry-content ul {
    margin: 0 auto 1.5em;
    display: block;
    width: 50%;
}

If you only want this change to apply to this specific page only, you can get more specific using the post id body class (found in the opening body tag) like this.

.postid-14980 .entry-content ol, .postid-14980 .entry-content ul {
    margin: 0 auto 1.5em;
    display: block;
    width: 50%;
}

SacredPath,

Thank you for your contribution. I tried the second snippet, and it slightly dropped down my second column on that page. I’m going to undo that change for now, and play around with it later on today.

(I like your idea of having more specific selectors!)

You are welcome, and you can try playing around with things to get it to look the way you desire. Since you had the two columns on that page, I wasn’t able to work out the actual CSS needed. You might try the second suggestion from @stephencottontail on a page without columns and see if it gives you what you are wanting.

I’m having the opposite problem. I have ordered and unordered lists and the responsive theme is centering all of ’em. I’ve checked my css. I’ve added text-align:left, and it won’t do anything BUT center. It never did this in my web editor, and I have no idea how to deal with this.

The page is https://kddidit.com/reading-books/my-pubs/your-portfolio/ypy-free-article-art-images/?preview=true&preview_id=17678&preview_nonce=81a777cfe7

KathyDavie,

I’ve got to leave for several hours, but it seems like you’re on the wrong thread: You are using the CyberChimps’ Responsive Theme…not Automattic’s Kelly.

If I’m correct, you might want to repost on that Themes’s forum. I’m not sure if it is a Theme issue, or WordPress issue.