
-
AuthorPosts
-
April 21, 2015 at 2:37 am #431703
I’m having a problem with the masonry portfolio where if it is contained within a 1/1 container, it has a maximum of 2 columns.
Notice in my screenshot how even though it’s on a large screen, it only shows 2 columns?
When using no container and full width, it shows up to 6 columns, which is better.
Am I missing a setting which is forcing the portfolio to show a maximum of 2 columns? I have it set to automatically decide based on screen width,
April 21, 2015 at 11:54 pm #432451Hi,
We’d need to see the backend settings, can you please create us a WordPress administrator account? post it here as a private reply.
Regards,
JosueApril 22, 2015 at 4:25 am #432527This reply has been marked as private.April 22, 2015 at 5:09 am #432539Hi!
Check it now, i’ve changed the Columns setting here – http://screencast.com/t/mBZjJriI
Cheers!
JosueApril 22, 2015 at 5:38 am #432546Thanks. I’ve tried that previously, I think it still doesn’t work correctly…
The problem with this is that if you reduce the width of the page to simulate smaller screen resolutions, it stays at 5 columns forcing the blocks to become very very small.
See example below of how it should work:
if you keep reducing the page size, the blocks remain the same size but the number of columns are reduced.
So the setting I think should be the one to behave like this:
This suggests the number of columns will reduce/increase depending on screen width, just like the teague.com example?
Ideally it would be something like this:
IF screen width >1650px
columns = 5
IF screen width > 1000px AND < 1650px
columns = 4
IF screen width > 700px AND < 1000px
columns = 3
IF screen width < 700px
columns = 2
ENDApril 22, 2015 at 5:50 am #432550In fact when NOT using a 1/1 container and setting it to ‘Automatic, based on screen width’, the number of columns ARE adjusted rather than the block size.
The setting functions correctly there, but NOT when in a 1/1 container!
Any reason why the 1/1 container is breaking this behaviour?
April 24, 2015 at 2:22 am #433851Hi, is there any solution to this?
In a nutshell, the problem:
– In a 1/1 container and selecting specific number of columns forces the boxes to be very small when the window is shrunk. It stays the same number of columns rather than reducing to a fewer number of columns.
When not restricted to a container and selecting ‘Automatic, based on screen width’, the number of columns is dynamic. E.g. when the window is shrunk to 800px wide, it reduces to 3 columns without shrinking the box sizes. This is how I want it to behave but in a 1/1 container.
April 25, 2015 at 6:05 am #434584Hey!
Found a workaround, check it. I’ve set a custom ID to that masonry element and added this to Quick CSS:
#custom_masonry .av-masonry { max-width: 1650px; margin: 0 auto; }
Best regards,
JosueApril 27, 2015 at 3:04 am #434963Cheers Josue, that worked well.
One more thing – is there a way to ensure empty areas are filled in the masonry, regardless of the sort method? Basically to fill all spaces as a first priority, then by date or whatever other sort method?
I’m using the ‘portrait’ and ‘landscape’ tags in order to force larger/wider/taller images.
April 27, 2015 at 8:32 am #435086Hey!
Try playing with the Order. You can use this plugin to adjust the order of custom post types – https://wordpress.org/plugins/post-types-order/
Regards,
Josue -
AuthorPosts
- You must be logged in to reply to this topic.