Olive Yew
Olive Yew

Reputation: 371

Resize text area of input box in HTML

I'm new to HTML and i'm trying to resize my input box. This is my code

<!DOCTYPE html>
<html>
<body>

<h1> Text Summarizer </h1>
<div class="login">
<h1>Insert the text that you want to summarize in the box below</h1>

  <form action="{{url_for('summary')}}"method="post">
    <input type="text" name="input" placeholder="type here" required="required"> 
    <br><br>
    <input type="submit",value="summary">
  </form> 
  <br>
  <br>
  {{data}}
  </div>

Here's what i have tried.

<!DOCTYPE html>
<html>
<body>

<h1> Text Summarizer </h1>
<div class="login">
<h1>Insert the text that you want to summarize in the box below</h1>

  <form action="{{url_for('summary')}}"method="post">
    <input type="text" name="input" placeholder="type here" required="required"> 
    <br><br>
   <textarea rows= "4" cols="50">
   </textarea>
   <br><br>
    <input type="submit",value="summary">
  </form> 
  <br>
  <br>
  {{data}}
  </div>

I'm now getting a second box next to my original textbox. Any help will be much appreciated.

Upvotes: 0

Views: 1836

Answers (2)

Nathan Bayne
Nathan Bayne

Reputation: 178

Or if you want an increased input tag, try this:

<!DOCTYPE html>
<html>
<body>

<h1> Text Summarizer </h1>
<div class="login">
<h1>Insert the text that you want to summarize in the box below</h1>

  <form action="{{url_for('summary')}}"method="post">
    <input type="text" name="input" placeholder="type here" required="required" style="width:35%; height:100px;"> 
    <br><br>
    <input type="submit" value="summary">
  </form> 
  <br>
  <br>
  {{data}}
  </div>

Upvotes: 1

Nathan Bayne
Nathan Bayne

Reputation: 178

If you want it to be a big text field with the "type here" placeholder, do the following:

<!DOCTYPE html>
<html>
<body>

<h1> Text Summarizer </h1>
<div class="login">
<h1>Insert the text that you want to summarize in the box below</h1>

  <form action="{{url_for('summary')}}"method="post">
   <textarea rows= "4" cols="50" type="text" name="input" placeholder="type here" required="required">
   </textarea>
   <br><br>
    <input type="submit" value="summary">
  </form> 
  <br>
  <br>
  {{data}}
  </div>

Upvotes: 1

Related Questions