Matching product heights

4 years 2 months ago 4 years 2 months ago by .
Posts: 242
More
Topic Author
Matching product heights #2140
Is there a way to match product heights so that a page doesn't become looking messy?
See screenshot & this link here - www.mynewsite.me.uk/lambretta/clothing/t-shirts
When a title is long or a price has much information, the product area in the grid becomes a bit messy and has a knock on effect further down the page too.

The Grid component uses Flexbox, so the height of grid columns is matched automatically. Just add the data-uk-grid-match attribute to your grid. If your grid wraps into multiple rows, only grid columns within the same row are matched. To match grid columns accross all rows just use data-uk-grid-match="{row: false}".


Nil Satis Nisi Optimum
Attachments:

Please Log in or Create an account to join the conversation.

4 years 1 month ago
Posts: 954
More
Matching product heights #2141
You should be able to do this with CSS. Its a very small change you have here.

What happens if you put a min-height on the .item-column class? ..

Please Log in or Create an account to join the conversation.

4 years 1 month ago 4 years 1 month ago by .
Posts: 242
More
Topic Author
Matching product heights #2142

cnorin wrote: What happens if you put a min-height on the .item-column class?

mmm? I just tried that & didnt seem to work? Although I would see this as a bit of a work around.

Could you not add into the VMuikit overides to match height?
I think it would benefit everyone, as nobody likes products that are not in line with each other

Nil Satis Nisi Optimum

Please Log in or Create an account to join the conversation.

4 years 1 month ago
Posts: 954
More
Matching product heights #2143
sure, we can .. I think we had this before ..

Thing is though ... if you have a very short description and title on one product. (also a image that is low in height) you will get A LOT of white space next to a product with the opposite things. Let med discuss this with my develop right away

Please Log in or Create an account to join the conversation.

4 years 1 month ago
Posts: 242
More
Topic Author
Matching product heights #2144
mmm?
I think if shop owners are daft enough to have a short description in one product and not in another AND products with images that are not matched, then they deserve the white space :lol:

I personally like straight, uniformal lines & would have assumed that this was the majority also?

Let me know what you think & if I'm on my own, maybe I can add it in myself somewhere

Thanks in advance,
Andy

Nil Satis Nisi Optimum

Please Log in or Create an account to join the conversation.

4 years 1 month ago
Posts: 954
More
Matching product heights #2145
I see what you mean ... I think we had this before but we change grid layout to be somewhat more flexible ...
I will get back to you soon here, what we decide

Please Log in or Create an account to join the conversation.

4 years 1 month ago
Posts: 954
More
Matching product heights #2148
the problem here is that we have started to use the grid.js so that we can have cool filtering functions where products animate into place. But this grid.js give limitations that we did not have before. And we are discussing on what is the best approach here... also discussing if a custom jquery thing might be a good way to solve that. But we usually wants to keep things as UIkit as possible.

getuikit.com/docs/grid-js.html

Please Log in or Create an account to join the conversation.

4 years 1 month ago
Posts: 242
More
Topic Author
Matching product heights #2149
Ah OK, But I wander how they do it in widgetkit2. There is option for dynamic or fixed grid in the gallery.

When you set up a gallery in WK2 you get the option for dynamic grid or fixed grid, but the fixed grid still gives you the cool filtering functions too.

Nil Satis Nisi Optimum

Please Log in or Create an account to join the conversation.

4 years 1 month ago
Posts: 954
More
Matching product heights #2150
MM, we really need to take a closer look at Widgetkit 2 .. we've had in mind of doing a VM plugin for this for a long time now.. just that Widgetkit 2 seems to have not been quite mature uintil quite recently ..

Please Log in or Create an account to join the conversation.

4 years 1 month ago
Posts: 954
More
Matching product heights #2151
which one would you prefer from these two?






Attachments:

Please Log in or Create an account to join the conversation.

Time to create page: 0.362 seconds
Powered by Kunena Forum

We accept PayPal, 2Checkout & Electroneum payments:

We accept PayPal payments    We accept 2checkout payments  electroneum payment


For news and updates please like :