Home Forums Latest articles overlapping the bottom ones

This topic contains 8 replies, has 3 voices, and was last updated by  smagnun 1 month, 3 weeks ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #4299

    smagnun
    Participant

    Hello

    First of all thanks for this great and simple theme!

    There is a weird thing happening in the front page, articles are overlapping the bottom ones (see image below), but, when I refresh the page OR when I switch between websites (it’s a multisite wordpress) like https://bitcoinfeed.news/ to https://bitcoinfeed.news/pt it usually correct this issue.

    However it is not a good way to solve the problem I guess 🙁

    Please advise.

    Thanks a lot

    overlapped

    #4301

    Yazmin
    Keymaster

    Hello

    The masonry layout uses absolute positioning to work out where each article is positioned, and it looks like those “like buttons” with thumbs up/down are being added after the articles positioning has been calculated.

    Are the like buttons powered by a WordPress plugin?

    #4302

    Yazmin
    Keymaster

    Can you try adding this to Customize > Additional CSS:

    .masonry-entry {
        margin-bottom: 30px;
    }

    This will add some extra space below each article to take account of those “like buttons”.

    #4307

    smagnun
    Participant

    yes, this is a plugin from wordpress, and it looks like the like buttons are doing this.

     

    this solution doens’t work, probably because the absolute stuff

    the weird thing is when I switch between the website this solve.

     

    hard, I don’t want to deactivate the like buttons…

    if you have another idea let me know, thanks anyway

    #4308

    smagnun
    Participant

    sorry, actually this padding-bottom solve the issue, not perfect because when it loads correctly I may see a blank space below the articles, but it’s ok, better than cut it…

     

    thanks

    #4309

    smagnun
    Participant

    after a few tests I realized it is still overlapping…

     

    even with this solution, any other idea?

     

    thanks

    #4310

    Andy
    Keymaster

    Hi,

    I have taken a quick look at this.

    A possible solution would be to make the thumb buttons only appear when hovering over each article with this additional css:

    .masonry-entry .likebtn_container{
        display: none;
    }
    .masonry-entry:hover .likebtn_container{
        display: block;
        position: absolute;
        top: 5px;
        left: 5px;
    }
    #4315

    smagnun
    Participant

    this solution seems to be good

     

    I’ll test them and see which one is better, thanks for the patience

    #4359

    smagnun
    Participant

    just posting the solution, this was the best way I find to solve this, thanks for this great theme 🙂

    #masonry-loop .post-wrapper .entry-content {
    position: relative;
    }
    #masonry-loop .masonry-entry .likebtn_container {
    display: block;
    position: absolute;
    top: -27px;
    right: 2em;
    }

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

You must be logged in to reply to this topic.