how to set the text overlapping issue in the plp page,hovering on the text stop the movement of it ,solve the issue in zooming aspect
for solve this type of issue we can do a proper design and when ever we are going to use width then we need to do with the percentage
this code is for padding issue :
.global-views-pagination-count{ @extend .pagination-count; color:$sc-color-black; font-size: 16px; font-weight: 500; font-family: ‘poppins’; @media (min-width:0px) and (max-width:600px) {
font-size: 12px;
}}
.facets-facet-browse-pagination .global-views-pagination-count, .facets-facet-browse-pagination .global-views-pagination-count {padding: 10px 0px 10px 10px;@media (min-width:0px)and(max-width:350px) { width: 80px; position: relative; bottom: 15px;} }
//pr.facets-facet-browse-pagination .global-views-pagination{
width: 100%;background-color: #FFFFFF;position: relative;bottom: -20px;@media (min-width:725px) and (max-width:992px) { bottom: 37px;}@media (min-width:641px) and (max-width:724px) { width: 102.6%; bottom: 24px;}@media (min-width:0px) and (max-width:640px) {bottom: 37px;
}}
.pagination-links li, .global-views-pagination-links li {float: left; height: 32px;width: 32px;text-align: center;}
.global-views-pagination,
.pagination-links a,
.global-views-pagination-links a {
display: block;
text-decoration: none;
line-height: 30px;
height: 33px;
padding: 0px;
// padding-left: 11px;
}
this one for the zooming aspect:
.facets-item-cell-grid-quick-view-link { @extend .item-cell-quick-view-link; width: 100%; height: 50px; padding: 15px 15px 15px 15px; font-size: 112%; line-height: 1; letter-spacing: normal; text-align: center; color: #F1A739; background-color: white; border-radius: 38px; /* font-family: ‘Poppins’; */ font-weight: 400; font-family: ‘Poppins’; border-color: #dfdfdf;}
here we need to give the width in percentage then it will not overlap in the zoom aspect
thank you