Results 1 to 8 of 8

Thread: HTML's textarea tag

  1. HTML's textarea tag

    HTML's textarea tag can produce great results, but is is one of the HTML tags that I don't see used very often.

    The tag looks like this:

    HTML Code:
    <textarea rows="20" cols="60">
    We hold these truths to be self-evident, that all men are created equal, that they are endowed by their Creator with certain unalienable Rights, that among these are Life, Liberty and the pursuit of Happiness. That to secure these rights, Governments are instituted among Men, deriving their just powers from the consent of the governed, -- That whenever any Form of Government becomes destructive of these ends, it is the Right of the People to alter or to abolish it, and to institute new Government, laying its foundation on such principles and organizing its powers in such form, as to them shall seem most likely to effect their Safety and Happiness.
    </textarea>
    The results will look something like this:



    textarea is good for displaying long text blocks, such as Terms or Service or Acceptable Use Policies, it is also great for displaying source code.
    Submit Your Webmaster Related Sites to the NB Directory
    I swear, by my life and my love of it, that I will never live for the sake of another man, nor ask another man to live for mine.

  2. #2
    Nice tip Will. I have just used it recently myself.

  3. #3
    Join Date
    Apr 2010
    Location
    india
    Posts
    338
    when displaying sourcecode don't forget to add disabled option to have better visibility.

  4. #4
    It's bad practice (in professional web design) to use the textarea tag outwith a form. The reason being that a div can produce the exact same results with a little CSS.

    I'm actually surprised its not depreciated by now.

  5. #5
    Join Date
    Apr 2010
    Location
    india
    Posts
    338
    Quote Originally Posted by tsdesigns View Post
    It's bad practice (in professional web design) to use the textarea tag outwith a form. The reason being that a div can produce the exact same results with a little CSS.

    I'm actually surprised its not depreciated by now.

    just out of curiosity how to add Scrollbar in Div tag

  6. #6

    Lightbulb

    Quote Originally Posted by anantshri View Post
    just out of curiosity how to add Scrollbar in Div tag
    give the div a fixed height and add an overflow property with the value "scroll".
    if you would like to also add a horizontal scrollbar set a fixed width.

    example:

    Code:
    /* vertical scrollbar */
    
    .v-scroll {
      height: 200px;
      overflow: scroll;
    }
    
    /* horizontal scrollbar */
    
    .h-scroll {
     width: 200px;
     overflow: scroll;
    }
    
    /* both sides */
    
    .scroll {
      width: 200px;
      height: 200px;
      overflow: scroll;
    }

  7. #7
    Quote Originally Posted by anantshri View Post
    just out of curiosity how to add Scrollbar in Div tag
    Quote Originally Posted by Aziz View Post
    give the div a fixed height and add an overflow property with the value "scroll".
    if you would like to also add a horizontal scrollbar set a fixed width.

    example:

    Code:
    /* vertical scrollbar */
    
    .v-scroll {
      height: 200px;
      overflow: scroll;
    }
    
    /* horizontal scrollbar */
    
    .h-scroll {
     width: 200px;
     overflow: scroll;
    }
    
    /* both sides */
    
    .scroll {
      width: 200px;
      height: 200px;
      overflow: scroll;
    }
    ^^ Just like that.

    Although I wouldn't use overflow:scroll; I would use overflow:auto;

    The only difference is that overflow:auto; will only use a scrollbar when the content inside the div is more than the height of the div whereas overflow:scroll; will put a scrollbar in anyway (even if there isn't anything to scroll).

  8. #8
    Join Date
    Apr 2010
    Location
    india
    Posts
    338
    Quote Originally Posted by tsdesigns View Post
    ^^ Just like that.

    Although I wouldn't use overflow:scroll; I would use overflow:auto;

    The only difference is that overflow:auto; will only use a scrollbar when the content inside the div is more than the height of the div whereas overflow:scroll; will put a scrollbar in anyway (even if there isn't anything to scroll).

    once again my whole day is not wasted and i keep learning new things.

Similar Threads

  1. HTML
    By Sbfc_ in forum Community Building
    Replies: 8
    Last Post: 6 April, 2010, 17:13 PM
  2. Html/os
    By superfast502 in forum Programming
    Replies: 0
    Last Post: 20 December, 2009, 00:00 AM
  3. [WTH] psd to web 2.0 html
    By chatterbox in forum Services
    Replies: 2
    Last Post: 5 December, 2009, 14:19 PM
  4. HTML 5
    By Duegar in forum Programming
    Replies: 8
    Last Post: 14 January, 2009, 03:58 AM
  5. [WTS] Charm HTML PSD to HTML service
    By yangyang in forum Services
    Replies: 0
    Last Post: 10 December, 2008, 02:36 AM

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •