making cart-popup same size as cart

Hi Rawat

This is an output when its view-details look at the size, want the cart-popup to be same as cart.

can i see the output image. and inspect eliment ?

Hi Guys 

Based on the given answers, i have used css styles but when click view-details the cart-popup-0, 1, 2 etc still same. See my code below. What am missing please advice

/**
*@author:Gcobani Mkontwana
*@date:08/05/2023
*Styles the position of a cart-popups.
**/
.card-popup-container, 
#cart-popup-0, 
#cart-popup-1, 
#cart-popup-2, 
#cart-popup-3, 
#cart-popup-4, 
#cart-popup-5 {
    display: none;
}

/**Size of the cart when view-details popup*/
.cart-popup-0, #cart-popup-1, #cart-popup-2 {
    height:auto;
    float:left;
}

in this case you need to make height:auto; and float:left; then it will auto adjust the content size 

To make the size of the cart-popup the same as the cart, you can use the same CSS styles for both elements. Based on the provided markup, it seems like the card elements in both the cart and the cart-popup have the same structure.

You can add a class to the card elements in the cart-popup and then use the same CSS styles that are applied to the card elements in the cart. Here's an example of how you can do that using jQuery:

javascript code:

$(document).ready(function() {
  // Get the width and height of the card element in the cart
  var cardWidth = $('.product-item').width();
  var cardHeight = $('.product-item').height();
  
  // Set the width and height of the card element in the cart-popup
  $('.card-popup .card').css({
    'width': cardWidth + 'px',
    'height': cardHeight + 'px'
  });
});

This code gets the width and height of the card element in the cart using the width() and height() functions in jQuery, and then sets the same width and height to the card element in the cart-popup using the css() function. You can adjust the code to fit your specific markup and CSS styles.