1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Fixed style issue

Discussion in 'Resolved Bug Reports' started by erich37, Jan 13, 2013.

  1. erich37

    erich37 Well-Known Member

    I have changed the body-background-color to "white" and the color of the inner content to pink.
    Fixed-width-style.

    I also checked this with the "XF default"-style and also here at Xenforo.com, I do see the same issue here.
    So this issue seems to be a small XF-design-bug.


    Code:
    #content .pageContent {
        background-color: #FCD7E2;
        padding: 10px 20px;
    }
    However, at "Registered Members"-page, this is showing fine.
    But at "Members / Recent Activities" it is showing strange. Seems like a padding or something is missing at the left-side.

    I have check via FireBug, but can not figure it out.


    Appreciate your help!
     
    Jake Bunce likes this.
  2. MagnusB

    MagnusB Well-Known Member

    You have a link? My guess is that the right part there is transparent, and it is inheriting the color from one of the parents. You will have to check the parents one by one to figure out where it is coming from.,
     
  3. erich37

    erich37 Well-Known Member

    this issue can also be seen here at Xenforo.com

    just go to this page:
    http://xenforo.com/community/recent-activity/


    then change the background-color CSS (via Firebug) for example to black-color:

    Code:
    #content .pageContent {
        background-color: #000000;
        padding: 10px 20px;
    }

    You will see that there is a "padding" at the left-side of the Avatar or something else missing.

    However, at "Registered Members", it is showing fine:
    http://xenforo.com/community/members/


    xfdefault-recent-activity.png


    xfdefault-registered-members.png
     
    Jake Bunce likes this.
  4. MagnusB

    MagnusB Well-Known Member

    #content .pageWidth is the one you are looking for.
     
  5. erich37

    erich37 Well-Known Member


    not sure what to change in order to fix this?
    As the CSS you have mentioned is the same for both "Recent Activity" and "Registered Members", however those 2 pages show differently....

    Code:
    #content .pageWidth {
        background-color: #FCFCFF;
    }
    .pageWidth {
        margin: 0 auto;
        width: 990px;
    }
     
  6. MagnusB

    MagnusB Well-Known Member

    Well, they use different parents. The recent activity use newsFeed and members use primaryContent. I am not sure what you are after here, you just need to find what parent you need to change. primaryContent has a 10px padding all around, newsFeed does not.
     
    erich37 likes this.
  7. erich37

    erich37 Well-Known Member

    oh, I just want to have the same padding for "Recent Activity" as there is for "Registered Members".

    Do you know what is the CSS for the "newsFeed" or what kind of CSS I need to add to template "extra.css" in order to achieve this?



    Many thanks!
     
  8. Shelley

    Shelley Well-Known Member

    Couldn't you add something like this in extra.css?

    Code:
    .news_feed_page_global .eventList .avatar .img {
    margin-left: 10px;
    }
    .news_feed_page_global .event .content {
        margin-left: 75px;
    }
    
     
    Jake Bunce and erich37 like this.
  9. erich37

    erich37 Well-Known Member


    you are genious :love: .... that did the trick (y)


    what is the "margin-left: 75px;" actually doing ? Is this already included in the default style ?
    I understand that the 10px is what has been missing, but I do not understand how you come up with the 75px stuff ?
     
  10. Shelley

    Shelley Well-Known Member

    You're welcome,

    To compensate for the additional 10px margin to the left hand side of the avatar. It was originally 65px and had to be adjusted by 10px otherwise the text would sit flush on the right hand side of the avatar.
     
    erich37 likes this.
  11. Shelley

    Shelley Well-Known Member

    Actually, try removing the code i gave you and just insert the following in extra

    Code:
    .news_feed_page_global .eventList .avatar .img {
    margin: 0 10px;
    }
    
    
     
  12. erich37

    erich37 Well-Known Member

    yeah, understand.

    Problem solved.


    Thanks a lot! :)
     
  13. Shelley

    Shelley Well-Known Member

  14. erich37

    erich37 Well-Known Member

    nope.
    This is moving the "Date" at the "Recent Activity" strangely too much to the left, meaning in some cases the "Date" is totally attached to the Avatar-image. There is no space between "Date" and "Avatar-image", although the date is underneath the Avatar....

    The code you provided initially (first) is working fine. :)
     
    Shelley likes this.
  15. Shelley

    Shelley Well-Known Member

    Ah okay. yeah I just tried the code and it does slightly shift to the left. :D
     
    erich37 likes this.
  16. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Hmm. This could be considered a consistency problem:

    Recent Activity
    Screen shot 2013-01-13 at 2.00.59 PM.png

    Members
    Screen shot 2013-01-13 at 2.01.47 PM.png

    You can see one has 10px padding all around, whereas the other removes that padding from the left side.

    It's apparently intentional:

    events.css

    Code:
    .event,
    .event.forceBorder:first-child
    {
    	overflow: hidden; zoom: 1;
    	padding-left: 0;
    	padding-right: 0;
    }
    
    The list items for recent activity explicitly remove the normal 10px primaryContent padding on the left and right.

    I will mark this confirmed. The devs will decide.
     
    erich37 likes this.
  17. MagnusB

    MagnusB Well-Known Member

    I wouldn't call it a bug as long as it is intentionally overwritten that way. The easiest way to add the same look, is to just add a 10px padding to the ol tag:
    Code:
    .news_feed_page_global .eventList {
      padding: 0 10px;
    }
    That way you won't have to use !important to override the default padding.
     
  18. Mike

    Mike XenForo Developer Staff Member

    I've removed the padding removal from the news feed stuff as it's simply inconsistent with pretty much everywhere else.
     
    Slavik, Romchik®, erich37 and 2 others like this.
  19. Shelley

    Shelley Well-Known Member

    1.1.4?
     
  20. Mike

    Mike XenForo Developer Staff Member

    Yeah.
     
    Slavik likes this.

Share This Page