WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Wu Wei theme - #footer-right move to right hand side of page. (9 posts)

  1. al_souty
    Member
    Posted 1 year ago #

    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.

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

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

  3. al_souty
    Member
    Posted 1 year ago #

    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. ]

  4. codingpet
    Member
    Posted 1 year ago #

    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?

  5. radhika
    Member
    Posted 1 year ago #

    @codingpet.com

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

  6. radhika
    Member
    Posted 1 year ago #

    @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;
    }
  7. al_souty
    Member
    Posted 1 year ago #

    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.

  8. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

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

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

  9. al_souty
    Member
    Posted 1 year ago #

    Alchymyth, that is perfect.Thanks so much.

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

Topic Closed

This topic has been closed to new replies.

About this Topic