WordPress.org

Ready to get started?Download WordPress

Forums

Changing the position of the heading/title words (9 posts)

  1. Sproke
    Member
    Posted 8 years ago #

    I want to change the position of the heading tag (http://blog.ordinarylife.co.nz) so that the writing doesn't go over the faces... I would like it to be at the bottom, and if possible to the left, but not entirly to the left (of the picture)

    Thanks for help!
    Sproke :0)

  2. moshu
    Member
    Posted 8 years ago #

    Play with the <h1> in the stylesheet.

  3. Sproke
    Member
    Posted 8 years ago #

    Yeah, I have been. But I want to know where to look because I can't find it

  4. Lorelle
    Member
    Posted 8 years ago #

    There's an article in the WordPress Codex, the documentation site, that will take you through the process step-by-step:

    http://codex.wordpress.org/Designing_Headers

    The h1 styles are in the style.css of your theme, as is the header style information. Open the file and search for those words.

    But the article will help you.

  5. Sproke
    Member
    Posted 8 years ago #

    Hey there Lorelle, thanks for pointing me in the right direction, but this tutorial doesn't give me any idea how to change the position of the text. Is there anything else out there that anyone knows of?

    Sproke :0)

  6. Mark (podz)
    Support Maven
    Posted 8 years ago #

    /* Begin Headers */
    h1 {
    padding-top: 140px;
    margin: 0px;
    }

    Try playing with those values, adding padding-left etc ...
    The description may (will) be affected but get one thing right and then we'll help with the next bit.

  7. Lorelle
    Member
    Posted 8 years ago #

    If you read the article, you would find that the instructions explain that the information regarding the header is found in the header.php template file. To change the placement of the different lines of text within the header, open the style.css file within your Theme and look for references to header, h1, and headerimg and any other CSS references found within your header.php template file within the header section.

    Various ways to change the "look" of the header is covered in the article in the section on Styling the Header, which looks at your CSS and shows you some examples.

    To change the position, you can use a variety of CSS positioning elements. I played around with it and this is what I came up with, but you can change it to match your own desires.

    h1 {font-size: 3em;
    position:relative;
    bottom:80px;
    left:150px }

    You will find information on the various positioning schemes used in CSS at http://www.w3.org/TR/CSS21/visuren.html#positioning-scheme, and scroll down to find the specifics on using top, bottom, left, right positioning declarations.

    And if you are using Firefox (it's free - DO IT), get the add for Web Developers that allows for editing your CSS while you are looking at the site. It opens a sidebar and you can type right in the CSS there to make things look different, testing different looks before you commit.

  8. Sproke
    Member
    Posted 8 years ago #

    Thanks for that sorry for getting you in a poopy mood, but the first article didn't actually tell me how to change the position of the text. It just said to 'play around with the header, h1, and headerimg', and I've been doing that, like I said in a prevous post, and getting mighty frustrated with it.

    I don't know how to make new CSS, but I can modify what's already there. Hence why that article was no help to me, because I would never have know to try
    'position:relative;'

    I am using firefox, but I cannot upgrade it for some reason.

  9. Sproke
    Member
    Posted 8 years ago #

    Thank you for the bit of code you left for me Lorelle, I have been able to play with that, and get what I wanted. thank you very much
    :0)

Topic Closed

This topic has been closed to new replies.

About this Topic