6 Replies Latest reply on Aug 29, 2006 7:35 AM by Newsgroup_User

    Overriding a CSS textarea style

    Joe Herl
      I'm creating pages for students to use to submit homework assignments. Each page has several textarea fields where they write answers to questions. Most of them should be about 7 rows high so the students can see most of each answer; but a few should be smaller, as I don't want to give the students the impression that they need to fill up the field.

      So I created the following rule definition in an external CSS style sheet using Dreamweaver 8:

      textarea {
      width: 90%;
      margin-right: 5%;
      margin-bottom: 10px;
      margin-left: 5%;
      height: 150px;
      }

      I would rather have specified rows than height, but I couldn't find anything like that in the CSS rule definition dialog box. The closest I could come was to specify the height of the "box." Now when I want to change the height of individual textareas, I don't know how to do it. Specifying the "rows" attribute when I define the textarea has no effect.

      Thanks in advance for any help.

      Joe Herl
        • 1. Re: Overriding a CSS textarea style
          Level 7
          You may specify the columns and rows of a textarea, inline:

          <textarea ... cols="" rows=""> </textarea>

          If you leave in that CSS declaration for textarea, that is going to
          over-ride anything you have declared inline (e.g., get rid of the "height"
          and just specify rows and columns for each individual textarea, and it
          should work).

          If you're asking for something more - just post back...

          HTH, take care.

          --
          Shane H
          shane@NOSPAMavenuedesigners.com
          http://www.avenuedesigners.com

          =============================================
          Web Dev Articles, Photography, and more:
          http://sourtea.com
          =============================================
          Proud GAWDS Member
          http://www.gawds.org/showmember.php?memberid=1495

          Delivering accessible websites to all ...
          =============================================


          "Joe Herl" <webforumsuser@macromedia.com> wrote in message
          news:ecvtn7$krf$1@forums.macromedia.com...
          > I'm creating pages for students to use to submit homework assignments.
          > Each
          > page has several textarea fields where they write answers to questions.
          > Most
          > of them should be about 7 rows high so the students can see most of each
          > answer; but a few should be smaller, as I don't want to give the students
          > the
          > impression that they need to fill up the field.
          >
          > So I created the following rule definition in an external CSS style sheet
          > using Dreamweaver 8:
          >
          > textarea {
          > width: 90%;
          > margin-right: 5%;
          > margin-bottom: 10px;
          > margin-left: 5%;
          > height: 150px;
          > }
          >
          > I would rather have specified rows than height, but I couldn't find
          > anything
          > like that in the CSS rule definition dialog box. The closest I could come
          > was
          > to specify the height of the "box." Now when I want to change the height
          > of
          > individual textareas, I don't know how to do it. Specifying the "rows"
          > attribute when I define the textarea has no effect.
          >
          > Thanks in advance for any help.
          >
          > Joe Herl
          >


          • 2. Re: Overriding a CSS textarea style
            Joe Herl Level 1
            > If you leave in that CSS declaration for textarea, that is going to
            > over-ride anything you have declared inline (e.g., get rid of the "height"
            > and just specify rows and columns for each individual textarea, and it
            > should work).

            I could do that, but I'm lazy :) I'd rather not have to specify the number of rows every time I create a textarea if I can do it in a style sheet and just alter the couple that should have a different number of rows. What I'm trying to figure out is whether this is possible at all. If not, your solution will work.

            Thanks!

            Joe
            • 3. Re: Overriding a CSS textarea style
              Level 7
              If you absolutely *need* to specify them in columns and rows, then you'll
              need to do it inline. If not, you can just create different classes for each
              textarea:

              textarea {
              margin-right: 5%;
              margin-bottom: 10px;
              margin-left: 5%;
              }

              .textarea1 {
              width: 90%;
              height: 150px;
              }

              .textarea2 {
              width: 90%;
              height: 50px;
              }

              And then apply them accordingly:

              <textarea ... class="textarea1"> </textarea>

              <textarea ... class="textarea2"> </textarea>

              --
              Shane H
              shane@NOSPAMavenuedesigners.com
              http://www.avenuedesigners.com

              =============================================
              Web Dev Articles, Photography, and more:
              http://sourtea.com
              =============================================
              Proud GAWDS Member
              http://www.gawds.org/showmember.php?memberid=1495

              Delivering accessible websites to all ...
              =============================================


              "Joe Herl" <webforumsuser@macromedia.com> wrote in message
              news:ed00ge$nnk$1@forums.macromedia.com...
              >> If you leave in that CSS declaration for textarea, that is going to
              > > over-ride anything you have declared inline (e.g., get rid of the
              > > "height"
              > > and just specify rows and columns for each individual textarea, and it
              > > should work).
              >
              > I could do that, but I'm lazy :) I'd rather not have to specify the
              > number of
              > rows every time I create a textarea if I can do it in a style sheet and
              > just
              > alter the couple that should have a different number of rows. What I'm
              > trying
              > to figure out is whether this is possible at all. If not, your solution
              > will
              > work.
              >
              > Thanks!
              >
              > Joe
              >


              • 4. Re: Overriding a CSS textarea style
                Joe Herl Level 1
                That makes sense. Thank you.

                Joe
                • 5. Re: Overriding a CSS textarea style
                  Level 7
                  On Tue, 29 Aug 2006 00:07:42 +0000 (UTC), "Joe Herl"
                  <webforumsuser@macromedia.com> wrote:

                  > I could do that, but I'm lazy :) I'd rather not have to specify the number of
                  >rows every time I create a textarea if I can do it in a style sheet and just
                  >alter the couple that should have a different number of rows.


                  Both the rows and the cols attributes are required by the html
                  specification. If you choose to omit them, the results may be
                  unpredictable.

                  Gary
                  • 6. Re: Overriding a CSS textarea style
                    Level 7
                    Right - he wants to keep them in there for validity, but I'd personally then
                    control it with CSS.

                    --
                    Shane H
                    shane@NOSPAMavenuedesigners.com
                    http://www.avenuedesigners.com

                    =============================================
                    Web Dev Articles, Photography, and more:
                    http://sourtea.com
                    =============================================
                    Proud GAWDS Member
                    http://www.gawds.org/showmember.php?memberid=1495

                    Delivering accessible websites to all ...
                    =============================================


                    "Gary White" <reply@newsgroup.please> wrote in message
                    news:5mj7f25g86pqhb8dp8tgglp4g7dnl05lco@4ax.com...
                    > On Tue, 29 Aug 2006 00:07:42 +0000 (UTC), "Joe Herl"
                    > <webforumsuser@macromedia.com> wrote:
                    >
                    >> I could do that, but I'm lazy :) I'd rather not have to specify the
                    >> number of
                    >>rows every time I create a textarea if I can do it in a style sheet and
                    >>just
                    >>alter the couple that should have a different number of rows.
                    >
                    >
                    > Both the rows and the cols attributes are required by the html
                    > specification. If you choose to omit them, the results may be
                    > unpredictable.
                    >
                    > Gary