Need help? Check out our Support site, then


Help with moving body text in CSS - Manifest Theme

  1. greenslateblog
    Member

    Hey,

    Struggling a little with the layout of my blog - http://www.greenslateblog.wordpress.com

    Trying to keep it pretty clean, so using manifest as a base. I have the CSS upgrade but am pretty new to it. Doing ok but need ot try and centre the body text underneath the menu. As you can see at the moment it is over to the left. I' sure its easy but i'm banging my head against a wall here.

    Would also love to know how to move the GreenSlate logo/text over, say to the left and higher. Basically, where is the code that lets me move around that title?

    Thanks so much in advance.

    Here is the code that I think is relevant

    html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    margin:0;
    padding:0;
    }

    body {
    line-height:1;
    background:#F0F0F0;
    font:62.5% Palatino, "Times New Roman", serif;
    color:#333;
    }

    ol,ul {
    list-style:none;
    }

    blockquote,q {
    quotes:none;
    }

    blockquote:before,blockquote:after,q:before,q:after {
    content:none;
    }

    :focus {
    outline:0;
    }

    ins {
    text-decoration:none;
    }

    del {
    text-decoration:line-through;
    }

    table {
    border-collapse:collapse;
    border-spacing:8px;
    }

    strong {
    font-weight:bold;
    }

    a:link,a:visited {
    color:#9C8A6A;
    text-decoration:none;
    }

    a:hover,a:active {
    color:#3E372B;
    text-decoration:underline;
    }

    h1 {
    font-size:7em;
    font-weight:normal;
    text-transform:normal;
    letter-spacing:.05em;
    word-spacing:.2em;
    margin:10px 0 20px;
    }

    h1 a:link,h1 a:visited {
    color:#336633;
    }

    h1 a:hover,h1 a:active {
    color:#000;
    text-decoration:underline;
    }

    h2 {
    margin-top:30px;
    margin-bottom:40px;
    font-size:2.4em;
    font-weight:normal;
    color:#0000;
    text-transform:uppercase;
    }

    h3 {
    margin-bottom:5px;
    font-size:1.6em;
    font-weight:normal;
    }

    h3 a:link,h3 a:visited {
    color:#333;
    }

    h3 a:hover,h3 a:active {
    text-decoration:underline;
    }

    h4 {
    margin-bottom:10px;
    font-size:7em;
    font-weight:bold;
    color:#333;
    }

    h5 {
    position:relative;
    top:-35px;
    margin-bottom:40px;
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size:1.2em;
    color:#000000;
    font-weight:normal;
    border-bottom:1px solid #336633;
    background:#F0F0F0;
    }

    h5 abbr {
    display:inline-block;
    position:relative;
    background:#F0F0F0;
    top:8px;
    margin:0 auto;
    padding:0 8px;
    }

    input[type=text],textarea {
    border:1px solid #000000;
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size:12px;
    color:#00000;
    padding:3px;
    }

    input:focus,textarea:focus {
    color:#00000;
    border-color:#999;
    }

    input[type=submit],#core-content #respond #comment-submit {
    color:#fff!important;
    font-weight:bold;
    background-color:#8ea7aa;
    background-image:url('images/button.png');
    background-repeat:repeat-x;
    background-position:left top;
    -moz-border-radius:10px;
    border-radius:10px;
    cursor:pointer;
    text-shadow:none;
    border-color:#999;
    border-style:solid;
    border-width:1px;
    padding:3px 10px;
    }

    input[type=submit]:hover,input[type=submit]:focus,#core-content #respond #comment-submit:hover {
    background-color:#697d80;
    border-color:#666;
    }

    #site-wrapper {
    padding-top:15px;
    width:600px;
    text-align:center;
    position:relative;
    margin:0 auto;
    }

    #site-description {
    color:#fff;
    font-size:1.2em;
    font-style:italic;
    width:100px;
    margin:18px auto 60px;
    padding:0 0 13px;
    }

    #main-nav {
    background:#F0F0F0;
    border-bottom:1px solid #336633;
    border-top:1px solid #336633;
    min-height:20px;
    margin-top:10px;
    position:relative;
    padding:6px 0 0;
    }

    #main-nav ul {
    text-align:center;
    width:45em;
    margin:0 auto;
    }

    #main-nav li {
    display:inline-block;
    font-size:1.5em;
    height:20px;
    margin-right:20px;
    text-transform:lowercase;
    }

    #main-nav li:last-child {
    margin-right:0;
    }

    #main-nav a {
    color:#000000;
    white-space:nowrap;
    }

    #main-nav a:hover {
    color:#2e301c;
    text-decoration:underline;
    }

    #main-nav .current_page_parent > a,#main-nav .current_page_item > a {
    color:#2a2d1a;
    font-weight:bold;
    }

    #main-nav .current_page_parent a:hover,#main-nav .current_page_item a:hover {
    color:#2e301c;
    }

    #main-nav ul ul {
    background:#fff;
    border-bottom:1px solid #f4f4f4;
    border-top:1px solid #eaeaea;
    display:none;
    position:absolute;
    top:100%;
    left:0;
    text-align:center;
    width:100px;
    margin:0 auto;
    padding:4px 0 3px;
    }

    #main-nav ul ul li {
    display:inline;
    font-size:12px;
    margin-right:20px;
    text-transform:uppercase;
    }

    #main-nav ul ul li:last-child {
    margin-right:0;
    }

    #main-nav ul ul a {
    color:#999;
    white-space:nowrap;
    }

    #main-nav ul ul a:hover {
    color:#2e301c;
    text-decoration:underline;
    }

    #main-nav ul li:hover > ul {
    display:block;
    }

    #main-nav ul ul .current_page_item a {
    color:#2a2d1a;
    }

    #main-nav ul .current_page_item > ul,#main-nav ul .current_page_ancestor > ul {
    display:block;
    }

    #core-content {
    float:center;
    width:500px;
    margin-top:15px;
    }

    The blog I need help with is greenslateblog.wordpress.com.

  2. Please do not copy and paste your entire CSS into the forums. We can get to it just fine and it just makes for marathon scrolling for anyone coming to this thread.

  3. greenslateblog
    Member

    Sorry about that. I thought I had seen someone complain that the code wasn't posted on another discussion. Apologies.

  4. The first widens the content to match the width you have set in #site-wrapper . The second moves the site title up a touch.

    #core-content {
    width: 600px;
    }
    
    #site-title {
    margin-top: 0;
    }

    Not really understanding what you are wanting with the title. It seems to look best for me where it is, centered. You have two options for moving it to the left.

    Something like this

    #site-title a {
    margin-left: -150px;
    }

    Or something like this

    #site-title {
    text-align: left;
    }
  5. Not a problem.

  6. greenslateblog
    Member

    Thanks a million, huge help

  7. You are welcome.

  8. greenslateblog
    Member

    Sorry, one last thing. If you look now you will see that I have tried to add a header instead of the site description. It allows me position it a bit easier, by just saving the image block as I want, and also allows me use other types of font. But i'd love to know if you could suggest a way to get it above the navigation menu??

    Many thanks in advance

Topic Closed

This topic has been closed to new replies.

About this Topic