WooCommerce Advanced Labels overlapping in phone view

  • Resolved eenger

    (@eenger)


    5 years, 9 months ago

    I use the WooCommerce Advanced Product Label plugin for description of details about the classes for sale on my shop page. I want the label to be the same size as the photo of the class (product photo) so I sized the label manually by eyeballing it on a computer screen. It looks good on the computer, however when viewed on a phone, the labels don’t adjust in size like the pictures do, so the labels end up overlapping!

    How do I make the labels stick to the size of the photo so that they shrink and grow with the photo regardless of what device its viewed on? The page I need help with is watermarkartcenter.org/education. Again, the issue only shows up when viewed on a phone. Thanks!

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Nico

    (@nicolamustone)

    Automattic Happiness Engineer

    Hello @eenger,
    I’ve tried to check the website but the page does not load. It tried to load for some seconds, then it just stops and shows a browser error.

    Is your website up and running at the moment?

    Stef

    (@serafinnyc)

    You would have to add a @media query for mobile. So something like this 

    .woocommerce-loop-product__title{
	line-height:17px !important;
}
.br_alabel span{
	max-width:170px !important;
	word-wrap: break-word;
	font-size:13px !important;
	line-height:14px !important;
	padding-top:5px;
}
    madeincosmos

    (@madeincosmos)

    Automattic Happiness Engineer

    Hi @eenger,

    This support forum is for the free WooCommerce core plugin. If you need help with our official WooCommerce Advanced Product Labels extension, please submit a support ticket here:

    https://woocommerce.com/my-account/create-a-ticket/

    Alternatively if you’re using a 3rd party Advanced Product Labels plugin, you can reach out to the plugin authors directly.

    Cheers!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘WooCommerce Advanced Labels overlapping in phone view’ is closed to new replies.