How to center the How Blank Theme layout
This is a followup to this question. Copy and paste this into your custom CSS to center the layout:
h1, h2, h3, h4, h5, h6, p, li, blockquote, pre, .post, #content .post_photo .html_photoset,
#content .post_answer .question, #footer div {
margin-right: auto;
margin-left: auto;
}
#content, #footer {margin-left: 0;}
#content p.postpagination {text-align: center;}
#content p.postpagination a span {display: none;}
#content p.postpagination a.previouspost:before {content: "\2190";}
#content p.postpagination a.nextpost:after {content: "\2192";}
#content .post_text {width: 468px;}
#content .post_photo p.container, #content .post_photoset p.container {
width: 100%;
text-align: center;
}
#content .post_photo p.container img.photo {margin-right: 0;}
#content .post_photo .html_photoset {width: 500px;}It works best with the header above the content, which was previously covered. Here is all of the code together:
#header {text-align: center; width: 100%; height: 36px;}
#header li, #header li.pages, #header li.archive, #header li.rss {
display: inline;
margin-right: 9px;
}
#header li.logo, #header li.portrait_circle {display: none;}
#header li.twitter span {display: none;}
#header li.twitter a .twitter_word {display: inline;}
#header li.groupmembers img.photo {
margin-top: -3px;
vertical-align: middle;
}
a.head:link, a.head:visited {color: black; text-decoration: none;}
a.head:hover {text-decoration: underline;}
a.head:active {color: black;}
#content {margin-top: 45px;}
h1, h2, h3, h4, h5, h6, p, li, blockquote, pre, .post, #content .post_photo .html_photoset,
#content .post_answer .question, #footer div {
margin-right: auto;
margin-left: auto;
}
#content, #footer {margin-left: 0;}
#content p.postpagination {text-align: center;}
#content p.postpagination a span {display: none;}
#content p.postpagination a.previouspost:before {content: "\2190";}
#content p.postpagination a.nextpost:after {content: "\2192";}
#content .post_text {width: 468px;}
#content .post_photo p.container, #content .post_photoset p.container {
width: 100%;
text-align: center;
}
#content .post_photo p.container img.photo {margin-right: 0;}
#content .post_photo .html_photoset {width: 500px;}Be careful out there.
