Support » Themes and Templates » Wu Wei theme – #footer-right move to right hand side of page.

  • Resolved al_souty

    (@al_souty)


    Hello,
    I’d like to move the #footer-right to the right hand side of the page.
    I can successfully do that with absolute positioning but if I minimise the browser window the footer contents will overlap and float over my blog post content.

    I’d love to be able to set a min-width value which the #footer-right will not go past, therefore, float over my blog post content.

    URL: http://redrockitdesign.jumbahost.com/littlekingdomsinyourchest/

    Any help would be much appreciated.

Viewing 8 replies - 1 through 8 (of 8 total)
  • Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    Can you not change the float: left; applying to #footer-right, to float: right; ?

    Hey Andrew,
    Thanks for your reply.

    I can easily float the #footer-right to the right of screen but my real problem is stopping it from moving over my post content if I minimise my browser screen. You can see what I’m talking about here.

    [ Please do not bump, that’s not permitted here. ]

    Hi,

    I don’t say the same issue as yours when I changed #footer-right from float:left to float:right. I also minimise the browser screen but when it’s small enough, a scrollbar will display.

    Maybe you already fixed the issue by setting up a fixed min width?

    @codingpet.com

    Try to add overflow: hidden in #footer-rightin style.css.

    @al_souty

    you will have do some changes in your style.css. you have comment the ‘/*Sidebar + Widgets *’ in style.css:

    /*#footer-widgets {width:60em; border-top:1px solid #d1d9dc; margin:0 0 1em 0; overflow: hidden; padding:1em 0 0 0;}
    #footer-widgets .widget-area { font-size:1.167em; line-height:1.5em; margin-right:1.429em; width: 15.713em; list-style: none; overflow: hidden;}
    #footer-widgets .widget li {list-style: none;}
    #footer-widgets li .widgettitle {font-size:1.714em; color:#959ea1; padding:0.333em 0;}

    table#flickr_badge_uber_wrapper {margin: 0;}
    table#flickr_badge_uber_wrapper tr td {border: none; padding: 0;}
    #flickr_badge_wrapper {border: none !important;}
    table#flickr_badge_uber_wrapper img {max-width: 15.713em; margin: 0;}

    .widget_rss img,
    .widget_authors img {margin: 0;}*/

    And the code in /*footer*/ in style.css:

    #footer-widgets ul li{
        width:220px;
        float:left;
        list-style: none;
    }
    #footer-widgets li:last-child {
        float: right;
    }

    Hi arti and codingpet,
    Thanks for your comments.

    I’m not sure if my issue is clear. I have tried your suggestions with no success.

    What I really want is the #footer-widgets to sit right & top of the .center-column
    At the moment the widgets I want are bound by the .center-column-sidebar properties and I cannot have them sit right of the .center-column-sidebar without absolute positioning. Absolute positioning is not what I’m after because if a person minimises their browser window the widget flows of the post content.

    Hope this helps with any solution.

    Michael

    (@alchymyth)

    Forum Moderator

    ul#footer-right{position:absolute;top:180px;right:0px;}
    .center-column{position:relative;padding-right:270px;}

    http://www.w3schools.com/Css/css_positioning.asp

    Alchymyth, that is perfect.Thanks so much.

    Issue now resolved.
    Thanks to everyone who commented on this issue. Much appreciated.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Wu Wei theme – #footer-right move to right hand side of page.’ is closed to new replies.