Home › Forums › WoodMart support forum › Product Page – Image width with CSS

Product Page – Image width with CSS

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • November 9, 2019 at 3:37 pm #155951

    Peter Laursen
    Participant

    Hi,

    I need to define product image size on single product page. I know all about the small, medium or large settings within the theme, but small is too small – and medium to big.

    I need product image to be 40% width – and description 60%.

    I have tried this CSS, as you have suggested to other earlier, but not really getting the desired result.

    .single-product-page .product-images.col-sm-8 {
    width: 40%;
    }
    .single-product-page .entry-summary.col-sm-4 {
    width: 60%;
    }

    Example of page: https://www.greenen.dk/produkt/srixon-z-85-baerebag-marineblaa/

    November 9, 2019 at 6:43 pm #155981

    Elise Noromit
    Member

    Hello,

    Which device do you want to change? Please clarify.

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

    body .product-image-summary-wrap .product-image-summary .product-image-summary-inner .col-lg-4{
flex: 0 0 60%;
	max-width: 60%;
}
body .product-image-summary-wrap .product-image-summary .product-image-summary-inner .col-lg-8{
flex: 0 0 39%;
	max-width: 39%;
}

    This CSS code is for full-width.

    Best Regards

    November 9, 2019 at 11:25 pm #156015

    Peter Laursen
    Participant

    Hi Elisa

    This works – but should only work for desktop.

    Can you fix CSS so only desktop has these settings?

    November 10, 2019 at 10:04 am #156056

    Elise Noromit
    Member

    Hello,

    Please remove the code from the Global to the Desktop field.

    Best Regards

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)