Column grid align how to fix it, im using im been trying to fig it out but nothing, im creating my own theme, im doing the change on xqep/xqeptheme/magento_catalog/web/css/souce/module/_listings.less also _module.less , im using magento/blank _listings.less file here the picture if someone there can help me, 1 to 10 im a 4 or 5 in magento level so im new.
- This will help you to fix you : community.magento.com/t5/Magento-2-x-Technical-Issues/…Rana Zain– Rana Zain2022-12-29 08:20:15 +00:00Commented Dec 29, 2022 at 8:20
3 Answers
You need to check 2 scenarios. it might be css or image resize related issue.
==> First is image resizes ratio related issue which you can solve using view.xml file in theme.
==> Second, you need to modify in theme less or css file for fixing this issue.
- the images no the issue, they have been edited on PS 800px and also i edit view.xml to 200px for catalog. Where i see the issue is on the description. but i can't find it out what file to edit.FastCellular– FastCellular2022-12-29 16:42:37 +00:00Commented Dec 29, 2022 at 16:42
Please add css in this file if you don't know which file is use catalog/product/list.phtml
Note : But this is not magento standard.
First Method -> The first way is to give min-height CSS for the product name so if the name is big, it will show the four-line height and if the name is short, then that will show the two or three lines and the remaining empty space so the price and add-to-cart button will be set as per the vertical.
Second Method -> The second way is the line ellipse, which is used to show how many lines you can show the product name. See the below example to get a better idea.
.product-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } Here, you can change the value of the line-clamp as per your requirement and you can set the column grid alignment.