Results 1 to 3 of 3

Thread: Two Classes in one

  1. #1
    Join Date
    Apr 2006
    Posts
    30
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Two Classes in one

    I have multiple classes that share the same style except one, the width. Is it possible to set one class for the shared styles and call it within the width class?

    Here's an example:

    Shared style:

    Code:
    .inputElements {
    background-color:white !important;
    background-image:url(txtBoxBG2.gif);
    background-repeat:repeat-x;
    border:1px solid #9A9B8D;
    color:#5D5E4E;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;
    font-weight:normal;
    height:22px;
    margin-bottom:5px;
    margin-top:2px;
    text-align:center;
    }

    Width class

    Code:
    .inputTblRmBl { 
    width:40px;
    }
    I want to call them both at the same time, something like this (which doesn't work)


    Code:
    .inputTblRmBl  , .inputElements { 
    width:40px;
    }
    Any suggestions?

    Thanks in advance!!!
    Last edited by dude9er; 05-07-2008 at 04:17 PM.

  2. #2
    Join Date
    Apr 2006
    Posts
    30
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    making it an easier question, can one css class call another?

  3. #3
    Join Date
    Mar 2007
    Location
    Currently: New York/Philadelphia
    Posts
    2,735
    Thanks
    3
    Thanked 519 Times in 507 Posts

    Default

    I thought I knew what you were asking when I started reading your post but I'm confused now. Let me give it a shot anyway.

    You can call two classes in your HTML. It's quite simple.

    Code:
    .green {
        color:green;
        border:1px solid black;
    }
    
    .noborder {
       border:0;
    }
    HTML Code:
    <p class="green noborder">This is green text with no border</p>
    <p class="green">This is green text with a border</p>
    Notice the order that I added the classes in. The CSS cascade is valid in the declerations as well. So, class="noborder green" would have a border because the second class (green) will override the border decleration of noborder. The opposite is also true. Class="green noborder" shows no border because the 2nd called noborder class overwrites the green class.

    The same principle applies even if you're not overwriting anything. To combine class attributes, just call both classes.

    I hope that helps. If not, please clarify what you're trying to do a little more.

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
  •