Web Analytics Made Easy -
StatCounter Multiple class= - CodingForum

Announcement

Collapse
No announcement yet.

Multiple class=

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Multiple class=

    Is it possible to use more than one class= to one textbox ?

    I want following on my site : class="memorize" and class="textboxstyle"

    Problem is that they dont seem to work when they are both added in same textbox...

    Someone got answer to this ?

    Thanks alot..

  • #2
    Easy answer. No, not possible. Or to be accurate the second over-rides the first.

    Example:-


    Code:
    <style type="text/css">
    .headline { border: 3px solid red }
    .newsitem { border: 2px solid red }
    .blurb    { border: 1px solid red }
    </style>
    ...
    <h1 class="headline newsitem blurb">Gordon Brown saves world financial system, but more lies ahead.</h1>
    The border will be 1px solid red.

    Mt. Kilimanjaro, the breathtaking backdrop for the Serena Lodge. Swim in the lovely pool while you drink it all in. - Travel advertisement
    Last edited by Philip M; Apr 15, 2009, 03:05 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

    Comment


    • #3
      already by poster above
      Last edited by TinyScript; Apr 15, 2009, 03:14 PM.

      Comment


      • #4
        Thanks for fast reply.. What a shame

        Comment


        • #5
          Originally posted by toolate View Post
          Is it possible to use more than one class= to one textbox ?

          I want following on my site : class="memorize" and class="textboxstyle"

          Problem is that they dont seem to work when they are both added in same textbox...

          Someone got answer to this ?

          Thanks alot..
          if you just want to have two classes that don't conflict like the example above, then you can use a space between the class names

          I don't know if this answers your question
          Code:
          <html>
          <head>
          <title>colors</title>
          <style type="text/css">
          p.italic {color: red;}
          p.underline {text-decoration: underline;}
          p.large {font-size: 150%;}
          p.small {font-size: 90%;}
          p.underline.small {font-variant: small-caps;}
          </style>
          </head>
          
          <body>
          
          <p class="italic large">This paragraph has <code>class="italic large"</code> It should be red and large.</p>
          <p class="underline large">This paragraph has <code>class="underline large"</code> It should be underlined and large.</p>
          
          <p class="italic small">This paragraph has <code>class="italic small"</code> It should be red and small.</p>
          <p class="underline small">This paragraph has <code>class="underline small"</code> It should be underlined, small, and it
          should use small-caps.</p>
          
          
          
          </body>
          </html>

          Comment


          • #6
            Wait a minute!

            Philip's answer NOT entirely true!

            In fact, NOT AT ALL true if the properties of the multiple classes don't interfere with each other!
            Code:
            <html>
            <head>
            <style>
            .one { border: solid red 3px; }
            .two { background-color: pink; }
            .three { font-size: xx-large; }
            </style>
            </head>
            <body>
            <form>
            <input value="class: [none]" size=30>
            <hr>
            <input class="one" value="class: one" size=30>
            <hr>
            <input class="one two" value="class: one two" size=30>
            <hr>
            <input class="one two three" value="class: one two three" size=30>
            <hr>
            <input class="one three" value="class: one three" size=30>
            <hr>
            <input class="two three" value="class: two three" size=30>
            <hr>
            <input class="two" value="class: two" size=30>
            <hr>
            <input class="three" value="class: three" size=30>
            </form>
            </body>
            </html>
            Go on, try it!
            Be yourself. No one else is as qualified.

            Comment


            • #7
              Hah! TinyScript faster than I am! But we sure agree!
              Be yourself. No one else is as qualified.

              Comment


              • #8
                the google is faster than the eye. LOL

                I knew I had seen it done just a few days ago but I had to resort toa search engine

                Comment


                • #9
                  this is how it looks like, and like philip said, the first does override the second when i do like this :

                  <input name="blah" class="textboxstyle" class="memorize" type="text"

                  Comment


                  • #10
                    well my question is now :
                    how can i use "memorize" and "textboxstyle" usin the method you peeps posted ?

                    thanks..

                    Comment


                    • #11
                      We just showed you, in several examples.
                      Code:
                      <input name="blah" [B][COLOR="Red"][SIZE="5"]class="textboxstyle memorize"[/SIZE][/COLOR][/B] type="text">
                      *ONE* class=

                      *SPACE* between the names.
                      Be yourself. No one else is as qualified.

                      Comment


                      • #12
                        omg you are right pedant.. im pretty sure i already tried this tho...

                        thanks for helpin peeps..

                        Comment


                        • #13
                          Again, whether it works or not depends on whether the two different class's styles conflict or not. Show the two classes if you aren't sure.
                          Be yourself. No one else is as qualified.

                          Comment

                          Working...
                          X