SitePoint Sponsor

User Tag List

Results 1 to 16 of 16
  1. #1
    SitePoint Evangelist Barnum's Avatar
    Join Date
    Oct 2008
    Posts
    418
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Increasing Size of Comment Box

    I found a tutorial on how to create a text box, or leave a message box. The area for commenting however is just oneline horizontally. Is there a way to increase it's size vertically?

  2. #2
    SitePoint Zealot My220x's Avatar
    Join Date
    Dec 2008
    Location
    United Kingdom
    Posts
    197
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I believe the cols attribute increases it's height and the rows attribute increases its width.

  3. #3
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,863
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by My220x View Post
    I believe the cols attribute increases it's height and the rows attribute increases its width.
    Other way around. COLS is the width and ROWS is the height. They will of course be overridden by the width and height specified in the stylesheet.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  4. #4
    SitePoint Zealot My220x's Avatar
    Join Date
    Dec 2008
    Location
    United Kingdom
    Posts
    197
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    Other way around. COLS is the width and ROWS is the height. They will of course be overridden by the width and height specified in the stylesheet.
    So, im guessing it would be best to set the width and height of it in the stylesheet?

  5. #5
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,863
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by My220x View Post
    So, im guessing it would be best to set the width and height of it in the stylesheet?
    The rows and cols attributes are required for a textarea tag to be valid even though you override them in the CSS.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  6. #6
    SitePoint Evangelist Barnum's Avatar
    Join Date
    Oct 2008
    Posts
    418
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    This worked...thanks as always.


    <h3>Commentbr></h3>
    <textarea rows="15" cols="60">
    </textarea>

  7. #7
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    When you do this, check in all browsers. I might be doing something wrong every time, but whatever widths I set in HTML get screwy in each browser. What seems to be the right width in FF and Opera is wider (or thinner, I can't remember anymore) in IE, and Konqueror just can't get anything right-- often the width is so wide it goes off the screen, or at least outside the container. Damn that browser all to hell, acid test my butt.

    Setting different widths in the CSS seems to make a difference, esp since I noticed someone (I can't remember who it was again) seemed to ignore the CSS so I actually did finally end up with most browsers looking alright (except Konq of course but fortunately nobody seems to use that one).

    Someone might know why I see this, and it might also have to do with my using Gnome as my desktop setup, as it's definitely screwed with Firefox (form inputs especially, they are much too long when viewed in FF on any Linux distribution I can find who's running Gnome... KDE seems ok).

  8. #8
    Non-Member
    Join Date
    Oct 2008
    Location
    Banned
    Posts
    506
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stomme poes View Post
    When you do this, check in all browsers. I might be doing something wrong every time, but whatever widths I set in HTML get screwy in each browser. What seems to be the right width in FF and Opera is wider (or thinner, I can't remember anymore) in IE, and Konqueror just can't get anything right-- often the width is so wide it goes off the screen, or at least outside the container. Damn that browser all to hell, acid test my butt.

    Setting different widths in the CSS seems to make a difference, esp since I noticed someone (I can't remember who it was again) seemed to ignore the CSS so I actually did finally end up with most browsers looking alright (except Konq of course but fortunately nobody seems to use that one).

    Someone might know why I see this, and it might also have to do with my using Gnome as my desktop setup, as it's definitely screwed with Firefox (form inputs especially, they are much too long when viewed in FF on any Linux distribution I can find who's running Gnome... KDE seems ok).
    Well You cant get the same output in every browser perfectly :P Why code for konquerer lol. I don't know anyone who uses that.

  9. #9
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,863
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    The rows and cols attributes are basically there for people who have CSS turned off in their browser. The width and height in the CSS will override those values for everyone else giving a far more consistent output.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  10. #10
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    :P Why code for konquerer lol. I don't know anyone who uses that.
    Since I don't expect each browser to be perfect, no, I don't worry. But I figure if I'm going to keep screen readers in mind while I code, I might as well keep Konq in mind too. I don't know anyone (except me) who uses it but as it comes with some Linux flavours I assume there are users.

  11. #11
    Keep Moving Forward gold trophysilver trophybronze trophy
    Shaun(OfTheDead)'s Avatar
    Join Date
    Nov 2005
    Location
    Trinidad
    Posts
    3,746
    Mentioned
    45 Post(s)
    Tagged
    0 Thread(s)
    Related question...

    How do you make those textarea's that automatically re-size when the viewer enters more content ?

    Is that done with javascript or is that a style ?




    Trying to fill the unforgiving minute
    with sixty seconds' worth of distance run.

    Update on Sitepoint's Migration to Discourse

  12. #12
    Guru in training bronze trophy SoulScratch's Avatar
    Join Date
    Apr 2006
    Location
    Maryland
    Posts
    1,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Shaun(OfTheDead) View Post
    Related question...

    How do you make those textarea's that automatically re-size when the viewer enters more content ?

    Is that done with javascript or is that a style ?




    Do you have an example? I think usually most people rely on the default height of a <textarea> element and the fact that overflow is set to scroll. If there's some type of auto resizer, then it must make use of at least two elements I think, querying the computed height of the element which contains text, and seeing if thats greater than or equal to the surrounding element. That or querying the length of the text, and doing some math based on the width of the element, length of string in relation to the width of outer element and such.. ahh my head's about to explode just thinking about it.
    Cross browser css bugs

    Dan Schulz you will be missed

  13. #13
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,863
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Shaun(OfTheDead) View Post
    Related question...

    How do you make those textarea's that automatically re-size when the viewer enters more content ?

    Is that done with javascript or is that a style ?




    You would do that with JavaScript. You need to work out both how many linefeeds the content contains and how many lines are long enough to wrap in order to work out when to increase the height.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  14. #14
    Non-Member
    Join Date
    Oct 2008
    Location
    Banned
    Posts
    506
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Remember this rule. Stylesheets only affect how the page is displayed in browsers. Anything other then that is just "fancy" stuff that is Javascript.

  15. #15
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    Exception, Shaun: Safari users get to change the height and width at will. There's a little corner you can pull at with the mouse.

    I wonder how Javascript would work with that. Bleh.

    I've heard people talk of such things but never actually seen it (changing as you type textareas). Is there some popular site with such things?

  16. #16
    Keep Moving Forward gold trophysilver trophybronze trophy
    Shaun(OfTheDead)'s Avatar
    Join Date
    Nov 2005
    Location
    Trinidad
    Posts
    3,746
    Mentioned
    45 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stomme poes
    I've heard people talk of such things but never actually seen it (changing as you type textareas). Is there some popular site with such things?
    Facebook.


    I've been hoping that is was something as simple as an overflow style (though nothing I've ever tried worked).

    I'm guessing if it's Javascript there could be issues if the viewer changes the browser text size.




    Trying to fill the unforgiving minute
    with sixty seconds' worth of distance run.

    Update on Sitepoint's Migration to Discourse


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
  •