Need help? Check out our Support site, then


WordPress.com Forums » CSS Customization

moving text widget to top of page

  1. anothernicole
    Member

    I've read some other forums on this topic, but I'm really new to CSS so I'm still a little lost. A lot lost, really.

    I have a text widget with 4 social icons in my sidebar (I figured out how to do that in the forums--thanks!), and I would like to move that text widget (those 4 icons) to the top left corner of my site (not in the sidebar).

    I know you have answered this for other people and I really did try to copy from that, but I didn't know how to find out what my text widget is called (some forums called it text-4, others text2, etc), so I got even more confused. Can you help me please?

    Ps. I know that the theme I am using has the option to make some social icons appear in the corner---but I wanted more icons than the theme offers; that's why I'm trying to do it this way.

    THANK YOU!!

    The blog I need help with is anothernicole.com.

  2. thesacredpath
    Staff

    I see you got it moved. You might want to try adding this to your CSS and then the text widget will be positioned relative to the overall container (canvas) instead of the browser window and will stay fixed in relation to the rest of the content.

    To see what I mean, narrow and widen your browser window and then add the following and again narrow and widen your browser window.

    #canvas {
position: relative;
}

  3. anothernicole
    Member

    THANK YOU!!

  4. designsimply
    Happiness Engineer

    Welcome to using CSS! I hope you end up loving it tons. :)

  5. anothernicole
    Member

    yay! i know i will--so far i LOVE it. and its so easy to learn with all the forums and support on wordpress--thanks you guys!!

  6. thesacredpath
    Staff

    You are welcome.

  7. annemariesanderson
    Member

    Hello all,
    Should the code supplied by TSP here apply to other themes?
    I think I'm trying to do something similar with my icons, but as pointed out here, if I narrow and widen the browser window things all get a bit messy.
    I'm using the clean home theme.
    http://annemariesanderson.com/

    Thankyou!

  8. thesacredpath
    Staff

    No, CSS is theme specific.

    There would be two options that I see right away.

    1. Set a left margin on #wrapper so that it stays stationary in relation to the icons

    #wrapper {
margin-left: 80px;
}

    2. Move the soundcloud and title/tagline to the right and lock the icons into #wrapper.

    Give #1 a try and see what you think. If you want to do #2, let us know and we can work out the changes.

  9. thesacredpath
    Staff

    I should mention that on #2, the icons would scroll up and down with the content area instead of being fixed, so perhaps #1 would be the best solution.

  10. annemariesanderson
    Member

    Thanks so much, solution #1 works perfectly!
    Yay! :)

  11. thesacredpath
    Staff

    You are welcome.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags