• 

  Karen Moreira

  Participant

  July 23, 2020 at 19:17

  Hello there,

  I added the option to calculate shipping on a product page, as shown in the image, but the elements (field to include numbers, button …) do not fit correctly in the column width, keeping the information hidden .

  How to solve this?

  Please, contact administrator
  for this information.

  #245200 Copied Theme version: 6.3.8 WooCommerce version: 4.3.1

  1 Answer

  

  Rose Tyler

  Support staff

  July 24, 2020 at 07:55

  Hello,

  Add the next code in Theme Options > Theme Custom CSS > Global Custom CSS:

  .woocommerce .product_meta #shipping-calc {
      flex-wrap: wrap;
      flex-direction: column;
      justify-content: center;
      margin-top: 50px;
  }
  .woocommerce .product_meta #shipping-calc #wscp-postcode.text {
      width: 100%;
      margin: 10px 0 0;
  }
  .woocommerce .product_meta #shipping-calc #wscp-button {
      width: 100%;
      margin-top: 10px;
  }
  commerce .product_meta #shipping-calc #delivery_truck {
      margin: 0 auto;
  }
  .woocommerce .product_meta #shipping-calc a {
      margin: 5px 0 0;
  }

  Regards

  #245214 Copied