Header Widget position

  • annvb1

    #6390

    Hi: I’ve placed a header widget on the site Dahna EcoKids and cannot figure out how to jog it up a bit and to the left a bit. Here’s how it looks now, with red arrows indicating how i want to move it:

    dhana-header-problem.png

    I’ve tried adding this code to the Custom CSS but it’s had no effect:

    .header-widget {

    position: fixed;

    right: 290;

    top: 10;

    }

    Thank you so much for your help.

    Prasanna SP

    #34196

    Add this to Custom CSS

    #text-14 {
    margin: -20px -40px;
    }

    iRpOw.png

    annvb1

    #34197

    Thank you Prasanna, but I still must be doing something wrong. The widget has moved all the way over to the left and is covering the wordpress header! See problem here.

    This is the code I have added into my CSS:

    .header-widget {

    position: absolute;

    right: 190px;

    top: 25px;

    }

    #text-14 {

    margin: -20px -40px;

    }

    Prasanna SP

    #34198

    Remove .header-widget css and align the widget with #text-14

    On mobile. So can’t really inspect elements. Sorry..

    annvb1

    #34199

    so sorry – no effect. the widget still sits aligned against the left border of the header.

    annvb1

    #34200

    Oh no! Now the entire page container has moved to the far left and is displaying at 1349px wide instead of 960px. I’m afraid to do anything else… how do i fix the container now too, along with the header widget?

    annvb1

    #34201

    OK the page container width issue resolved when I removed the header widget entirely. Phew! but i still haven’t resolved the header widget placement issue.

    annvb1

    #34202

    I resolved it by adding padding-left code to the style attributes for each element within the text widget itself:

    <P ALIGN=left style="padding-left: 735px;">THE GIFT OF T.L.C.!</p>
    <a href="http://dhanaecokids.com/wp-content/uploads/2012/12/GIFT_OF_TLC_Dec2012_DhanaEcoKids.pdf"><img src="http://dhanaecokids.com/wp-content/uploads/2012/12/TLC-logo-187x69.jpg" alt="The Gift of T.L.C.!" /></a>
    <a href="http://source.ethicalfashionforum.com/article/source-awards-2012-the-winners"><img src="http://dhanaecokids.com/wp-content/uploads/2012/12/SOURCE-runner-up-my-art-158x63.png" alt="Source Awards Runner Up" /></a>

    Josh

    #34203

    Marking thread as resolved. You can do this yourself as well.

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.