How to resize a custom liquid text box field?

[Anna3]

Hello, 

I am new to shopify and trying to resize this text box from my product page using the custom liquid template: 

the code I'm using is: 

<div class="field">

<textarea id="message" placeholder="Type your instagram handle if you'd like to be tagged" name="properties[Instagram Handle]" form="product-form-{{section.id}}"
class="text-area field_input"

></textarea>
</div>

 

When I remove the "text-area" class from the code, the appearance changes, but I’m aiming for a look similar to the Phone section in the Contact Us page. I'm using the Dawn theme.

Can someone please assist me with this?

Thanks in advance!

Best,
Anna

[KuldeepKumar20]

Hi @Anna3 ,

Please share the store URL

[Anna3]

Hi @KuldeepKumar20 

Url is: www.stickitmagnets.com.au

Password: startfun

Thanks

Anna 

[KuldeepKumar20 · Accepted solution]

Hi @Anna3 ,

Edit your theme file and open the base.css file and put the css code bellow in the file

CSS Code-

.product__column-sticky .field:after, .product__column-sticky .field:before {

box-shadow: none;

border: none;

display: none;

}

.product__column-sticky .field .text-area {

width: 78%;

min-height: 4rem;

}

Thanks

[Anna3]

Hi @KuldeepKumar20 

Thank you so much! That works! Have a lovely day!

Cheers

Anna

[Anna3]

Hi @KuldeepKumar20 

I just noticed another problem, I don't think it had anything to do with the code you provided cause when I removed it, the issue is still showing. 

When I add an item to cart, the checkout box is white, but you can still click on it: 

How can I fix this?

Thanks

Anna