1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. This forum is for release discussion only. Discussions that do not relate specifically to the resource release should be discussed in another, more appropriate forum.
    Dismiss Notice
  3. This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Move the userbit to the right on posts!

Discussion in 'Template Modifications [Archive]' started by Russ, Oct 11, 2010.

  1. Russ

    Russ Well-Known Member

    This is a quick tutorial to move the userbit to the right side on posts: This will also change that little left arrow to the left of the avatar.

    In message.css find:

    Code:
    .message .messageInfo
    {
        margin-left: 140px;
    }
    
    Replace with:
    Code:
    .message .messageInfo
    {
        margin-right: 140px;
    }
    
    In message_user_info.css find:

    Code:
    .messageUserInfo
    {
        float: left;
        width: 124px;
    }
    
    Replace with:
    Code:
    .messageUserInfo
    {
        float: right;
        width: 124px;
    }
    
    In quickreply.css find:

    Code:
    #QuickReply
    {
        margin-left: 140px;
    }
    
    Replace with:
    Code:
    #QuickReply
    {
        margin-right: 140px;
    }
    
    3. Find -> #QuickReply

    * Change margin-left: 140px to -> margin-right: 140px;

    In message_user_info.css find:
    Code:
            .messageUserBlock .arrow
            {
                position: absolute;
                top: 10px;
                right: -10px;
    
                display: block;
                width: 0px;
                height: 0px;
                line-height: 0px;
    
                border: 10px solid transparent;
                border-left-color: @messageUserBlock.border-color;
                border-right: none;
    
                /* Hide from IE6 */
                _display: none;
            }
    
                .messageUserBlock .arrow span
                {
                    position: absolute;
                    top: -10px;
                    left: -11px;
    
                    display: block;
                    width: 0px;
                    height: 0px;
                    line-height: 0px;
    
                    border: 10px solid transparent;
                    border-left-color: @messageAvatarHolder.background-color;
                    border-right: none;
                }
    
    Replace with:
    Code:
        .messageUserBlock .arrow
            {
                position: absolute;
                top: 10px;
                left: -10px;
    
                display: block;
                width: 0px;
                height: 0px;
                line-height: 0px;
    
                border: 10px solid transparent;
                border-right-color: @messageUserBlock.border-color;
                border-left: none;
    
                /* Hide from IE6 */
                _display: none;
            }
    
                .messageUserBlock .arrow span
                {
                    position: absolute;
                    top: -10px;
                    right: -11px;
    
                    display: block;
                    width: 0px;
                    height: 0px;
                    line-height: 0px;
    
                    border: 10px solid transparent;
                    border-right-color: @messageAvatarHolder.background-color;
                    border-left: none;
                }
    
    Hope this works out! Tell me if you guys and gals have problems and I'll do the best I can to help.
     
    Maryam, turtile, Rob Fritz and 3 others like this.
  2. Perspektif

    Perspektif Active Member

    When publications?
     
  3. Russ

    Russ Well-Known Member

    I'm sorry not sure what you mean
     
    Perspektif likes this.
  4. Perspektif

    Perspektif Active Member

    You're so cool :) very thanks :)
     
    Russ likes this.
  5. Brogan

    Brogan XenForo Moderator Staff Member

    Nice one Russ.
    Should come in very useful for those who want to switch.

    However, the very first change I made on my phpBB install was to move everything to the left so I don't think I'll be implementing this :D
     
    Russ likes this.
  6. Brandon Sheley

    Brandon Sheley Well-Known Member

    Does this code still work, I see the demo is down?
     
  7. clawsonr

    clawsonr Member

    Didnt work for me :(
     
  8. Russ

    Russ Well-Known Member

    I'll need to look at it again :) in a bit.
     
    clawsonr likes this.

Share This Page