Home Forums Basel support forum CSS to move Rectangular label to Bottom Left

CSS to move Rectangular label to Bottom Left

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #152592

    oleg_dmitriev
    Participant

    Hi your theme is very nice to work with, well done!

    When I introduce CSS (below) to move labels to Bottom Left, they move on the Category page, but not on the Product page. Please send CSS to move Labels to Bottom left on the Product page.

    https://imgur.com/a/esBLVqZ
    https://imgur.com/a/Q70R8NW

    My CSS
    .labels-rectangular {
    top: auto;
    bottom: 15px;
    left: 0;
    right: auto;
    }
    Thanks in advance!

    #152624

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    body .product-grid-item  .labels-rectangular {
       bottom: 5px;
       top:auto;
    }
    
    body .single-product-content .product-images .labels-rectangular {
        bottom:75px;
        top:auto;
    	  left:20px;
    	  right:auto;
    } 

    Best Regards

    #152631

    oleg_dmitriev
    Participant

    Thank you! it worked fine, perfect!
    In fact I changed Left Bottom in the Product Grid, and Right Top on the Product Page, but the main principle remained the same:

    body .product-grid-item .labels-rectangular {
    bottom: 15px;
    top:auto;
    }
    body .single-product-content .product-images .labels-rectangular {
    bottom:auto;
    top:15px;
    left:auto;
    right:15px;
    }

    #152647

    Hello,

    The reason was the selector. I have changed it if you have noticed it. If you have any questions please feel free to contact us.

    Best Regards

    #152665

    oleg_dmitriev
    Participant

    Thank you! I saw that you specified product grid and single product content, and that made the whole difference! thanks for your great help

    body .product-grid-item .labels-rectangular
    body .single-product-content .product-images

    #152673

    You are welcome! If you have any questions please feel free to contact us.

    Best Regards

Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘CSS to move Rectangular label to Bottom Left’ is closed to new replies.