Home Support Forums Themes Boss. theme Styling – Mobile View newsfeed margins too large

This question contains 11 replies, has 4 contibutors, and was last updated by  ocity 4 weeks ago.

Viewing 12 posts - 1 through 12 (of 12 total)
  • Question

    #68688
    @bstrehl

    Is there an easy way to reduce the very wide margins of the newsfeed stream in mobile view like on Facebook where the full width of the display is used for the newsfeed. The Boss mobile newsfeed has very wide margins left and right and the text block of an activity item covers only like half of the iPhone display. On smaller displays like an iPhone 5 this looks completely awful. The same applies to photos. I want to considerably reduce or even get rid of the margins completely on mobile view. Thanks.

    Answers

    #68694
    @anve

    HI @bstrehl,

    Please attach a screenshot to explain it as i am unable to understand it completely.

    Regards
    Anve

    #68705
    @bstrehl

    Here’s the screenshot. It’s not from an actual iPhone but that’s how it looks like on my older iPhone. I am talking about the margins on the left of the avatar picture and on the right side of the text. Reducing these margins to almost zero would be a more pleasant newsfeed experience on older smaller mobile screens. In the Facebook app, for example, the photos and text also extend almost to the width of the screen for a better experience.

    #68724
    @anve

    HI @bstrehl,

    Sorry but i can not replicate the issue of yours since it is looking fine at our end . PM me the site details , will check there and provide you the css.

    Regards
    Anve

    #68855
    @bstrehl

    There is not an “issue” with the mobile view on my site. It just doesn’t look very good on smaller smartphone screens. Just let me know how to reduce the margins left and right of the newsfeed content. See the picture in the post above and compare to Facebook mobile view. It’s pretty obvious what I mean.

    #68858
    @anve

    Hi @bstrehl,

    Please try applying the following css in child theme’s custom css option.

    
    @media screen and (max-width:480px){
    body.activity #buddypress .activity {
      padding: 0 10px !important;
    }
    }
    

    Regards
    Anve

    #68878
    @bstrehl

    Hi Anve,

    I copied the css in the custom css section of the child theme on dashboard but I couldn’t notice any difference for smaller screen sizes. I am not quite sure what this may have changed but I couldn’t notice anything…

    Best regards

    #68896
    @anve

    Hi @bstrehl,

    Please try applying the given css using ‘Simple custom css’ plugin. As i have applied the css and it works for me . Please refer to following screenshot.

    Regards
    Anve

    #68988
    @bstrehl

    ok, thanks for your help! I could make it work…

    #69000
    @anve

    Hi @bstrehl,

    Please ask if you have any question regarding the code . Good luck 🙂

    Regards
    Anve

    #73094
    @rickroche

    Anve, Thank you very much – That did not work for me – but you led me in the right direction. I’m new to css – did some reading and discovered that this is what worked for me on both an iPhone 5 and 6+

    body.activity #buddypress .activity {
    margin-right: -38px; !important;
    margin-left: -38px; !important;
    }

    Maybe that will help someone. Now trying to figure out how to decrease the spacing between the privacy setting and the ‘what’s new, username’
    -Rick

    #158725
    @ocity

    I tried the this code and still no luck for me can anyone help?

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

You must be logged in to reply to this question.