Tagged: ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #1214040

    What i’m hoping to do is get my product grid layout to look like this

    Desired Outcome

    I’ve managed this so far Current Outcome

    As you can see still a way off.

    • This topic was modified 4 years ago by LiamKenyon.

    Anyone any ideas?



    Thanks for the screenshots. Could you post a link to where we can see the actual element as well please?

    Best regards,


    Thanks for the response, i’ve added the urls in private section.


    Sorry for the late reply and thanks for the links, I don’t think these will be exactly the same, but with this css it is pretty close.
    Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

    li.product span.woocommerce-Price-currencySymbol {
    	 display: inline !important;
    	 line-height: 15px!important
    #main li.product span.price span.woocommerce-Price-amount.amount {
    	 display: block !important;
    	 line-height: 15px!important;
    li.product span.price {
    	 float: right !important;
    li.product div.inner_product_header_table {
    	float: left !important;
    li.product span.onsale {
    	display: none !important;
    #top #wrap_all li.product ins:before {
    	display: none !important;
    #top li.product .product_on_sale .inner_product_header {
        padding-right: 0 !important;
    li.product .inner_product_header_cell {
    	display: flex !important;
    li.product h2.woocommerce-loop-product__title {
        padding-right: 20px !important;

    After applying the css, Please clear your browser cache and check.

    Best regards,

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.