How can I remove an extra column from my product page?

Shopify Discussion
1

I want to remove this extra column as shown in image below product page S.s.

errorella.png
errorella.png1920×1088 293 KB

2

Hi @TheRealMan1
Use this css

.product-template-grouped .grouped-product .grouped-actions {
  width: 100% !important;
}
3

Thank you so much for your help it worked.

But for mobile device i want to remove this silder as shown in below S.S.

error mobile.png
error mobile.png1920×1088 303 KB

4

@TheRealMan1
Use this css

@media (max-width: 500px)
.product-template-grouped .grouped-content .scroll-content {
  min-width: unset !important;
}
}
5

It helped me but now sizes of the images, title, buttons are small. I don’t want to change size of images.

PFA below

error mobile2.png
error mobile2.png1920×1088 283 KB

6

Also can any one help me getting color swatch instead of dropdown button in variants option.