How to change size of texbox of webpage?

Question

I am trying to make a chrome extension. I am having 2-3 problems which I would like to discuss.

I want to change the size of textbox of facebook chatbox shown in right bottom corner.

So I am using javascript(not jquery). I did inspect element in chrome browser and got "_552h" classname for its div element.

Afterthis, I wrote alert(document.getElementsByClassName("_552h")); in content_scripts which runs for facebook page. This showed me [objectHTMLcollection] in alert box. This was just for testing so to see if I was accessing the element.

Then how should I access the textbox inside this div and access its css change height of textbox? Please show me through code, as I am beginner.

Also after this I would like to add one horizontal list of suggestion words for this textbox. So I tried to use jquery autcomplete which shows autocomplete but in vertical dropdown. So what kind of css would I require?

Also tell me if I can get english dictionary words list for this autocomplete source.

Answer 1

For CSS I might be able to help

for Textarea, you can style as below

._552h textarea{ some style here...}

For input text you can style as

._552h input[type='text']{ some style here...}