Before you ask please READ THIS

Fatmoon Multi Column portfolio in Mobile

As of now, portfolio or work list on (artisticeyephotographers.com) is multi column for desktop version, but in mobile version its single column, please help me making it multiple column

I actually tried doing this for device below 480 or 400 pixel(Say smartphones like iphone 6,7,etc) but not able to do so.


I am attaching actual and desired images named respectively. Please guide !


Thanks.
DesiredBelow480.png
343 x 480 - 206K
Actual2SmallerThan480.png
474 x 480 - 168K

Comments

  • AirAir
    Posts: 10,100
    Hello:-)

    You will have to add such custom CSS:

    @media only screen and (max-width: 480px) {
    .works-list-page .layout-fluid .bricks-columns-4 .archive-item {
    width: -webkit-calc(50% - 11px);
    width: calc(50% - 11px);
    }
    }
    This should do the trick for your current settings.

    With kind regards.
  • edited September 2017 Posts: 10
    Well Thanks alot, But I tried it placing in custom as well as additional css. But for some reason its not working.

    I still see only one column in devices less than 480 px.

    Thanks.
    Post edited by arjun_virmani on
  • AirAir
    edited September 2017 Posts: 10,100
    Now, that you have change it to single album, use this custom CSS instead:

    @media only screen and (max-width: 480px) {
    .single-album .layout-fluid .bricks-columns-3 .archive-item,
    .single-album .layout-fluid .bricks-columns-3 .grid-master {
    width: -webkit-calc(50% - 10px) !important;
    width: calc(50% - 10px) !important;
    }
    }
    Hopefully it will overwrite inline styles for single album.

    With kind regards.
    Post edited by Air on
  • edited September 2017 Posts: 10
    I actually changed it just now, but tried that earlier css while that still being the work list. Let me try it once.
    Post edited by arjun_virmani on
  • AirAir
    Posts: 10,100
    OK, let me know the result. I will inspect it on your page if you still don't see it working as desired.
  • edited September 2017 Posts: 10
    Check it out once, i think we are almost half way through, but with second column being blank on the right hand side.

    You are a real player !:)

    Any guesses, what next needs to be done
    Post edited by arjun_virmani on
  • AirAir
    Posts: 10,100
    I have updated custom CSS in my previous post, please try again with it:-)
  • Buddz, it seems like PERFECT now !
    Will bother you soon, when there is any pain in my life.

    Thanks. :)
  • AirAir
    Posts: 10,100
    Haha, cool ;-) Good luck !
  • Hi Buddy, this above snippet has stopped working after an update. Can you please take a look at artisticeyephotographers.com
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!