Loading ...
Sorry, an error occurred while loading the content.

Two Tables

Expand Messages
  • Jody
    Hi Guys and Gals, How do I define two tables in CSS? TABLE { width: 100%; background-color: #99CCFF; } TABLE.2 { width: 100%; color: #white; } If the second is
    Message 1 of 6 , Sep 17, 2001
    • 0 Attachment
      Hi Guys and Gals,

      How do I define two tables in CSS?

      TABLE
      {
      width: 100%;
      background-color: #99CCFF;
      }
      TABLE.2
      {
      width: 100%;
      color: #white;
      }

      If the second is correct what, tags do I use for it in <table> line?

      Thanks!
      Jody

      Clean-Funnies: click and send...
      mailto:c-f@...?subject=Subscribe
    • h.paulissen@facburfdcw.unimaas.nl
      Hi Jody, I think it is like this... In your example Table.2 inherits the characteristics of Table. If you want two different layouts for tables you can use
      Message 2 of 6 , Sep 18, 2001
      • 0 Attachment
        Hi Jody,

        I think it is like this...

        In your example Table.2 inherits the characteristics of Table. If you
        want two different layouts for tables you can use Table.1 and Table.2
        (or whatever name you chose).

        In your html code you can then use the following:

        <table class=1><tr><td>table 1</td></tr></table>
        <table class=2><tr><td>table 2</td></tr></table>

        If you want further distinction you can try out <tr class=...> or <td
        class=...>. In your css-code you have to define the layout for the
        different classes.

        Hugo

        --- In ntb-html@y..., Jody <av1611@e...> wrote:
        > Hi Guys and Gals,
        >
        > How do I define two tables in CSS?
        >
        > TABLE
        > {
        > width: 100%;
        > background-color: #99CCFF;
        > }
        > TABLE.2
        > {
        > width: 100%;
        > color: #white;
        > }
        >
        > If the second is correct what, tags do I use for it in <table> line?
        >
        > Thanks!
        > Jody
        >
        > Clean-Funnies: click and send...
        > mailto:c-f@S...?subject=Subscribe
      • Grant
        ... Give the table a unique ID Stylesheet will go #jo { width: 100%; background-color: #99CCFF; } #dy {
        Message 3 of 6 , Sep 18, 2001
        • 0 Attachment
          > How do I define two tables in CSS?
          >
          > TABLE
          > {
          > width: 100%;
          > background-color: #99CCFF;
          > }

          > TABLE.2
          > {
          > width: 100%;
          > color: #white;
          > }

          Give the table a unique ID
          <table id="jo"> </table>
          <table id="dy"> </table>

          Stylesheet will go

          #jo
          {
          width: 100%;
          background-color: #99CCFF;
          }


          #dy
          {
          width: 100%;
          color: white;
          }

          As an aside for selectors I usually try do the following..

          id selectors for layout. I try to use px or % because we are dealing with
          the 'box model' and it's relationship to the @media 'screen'.

          tag selectors for defining the look of structural elements eg; All h1 in
          the document will have this font this color with this background be aligned
          to the left.
          I try to use ems for indentation, font-sizes etc because we are dealing with
          relationships between letters.

          class selectors to separate out common themes. To use a common trite
          example .warning{color: red}
        • Greg Chapman
          Hi Jody, ... Just define two classes. Something like: .skybluetable { width: 100%; background-color: #99CCFF; } .whitetable { width: 100%; color: #white; }
          Message 4 of 6 , Sep 18, 2001
          • 0 Attachment
            Hi Jody,

            > How do I define two tables in CSS?

            Just define two classes. Something like:

            .skybluetable
            {
            width: 100%;
            background-color: #99CCFF;
            }

            .whitetable
            {
            width: 100%;
            color: #white;
            }

            and call them with:

            <TABLE class="skybluetable">

            and

            <TABLE class="whitetable">

            This is too simple an answer. I must have missed something in the
            question!

            As pointed out in the other thread I'm posting to, It's bad practice
            to define only a foreground colour or only a background colour, so I
            trust the final version will include both.

            Accepting that this is only a fragment of the full stylesheet and
            other parts of the cascading properties may overcome this, but it is
            possible that a viewer of the site has a white background set on his
            browser making the second definition of yours invisible.

            Greg
          • John Zeman
            Hoo boy, I haven t checked this list in about a month and see quite a bit has been going on... :) Jody I ve only quickly scanned the responses to your post, if
            Message 5 of 6 , Sep 25, 2001
            • 0 Attachment
              Hoo boy, I haven't checked this list in about a month and see quite a
              bit has been going on... :)

              Jody I've only quickly scanned the responses to your post, if anyone
              has mentioned what I'm about to, then I apologize for the repetition..

              I know the frustration of tables and CSS.. I use both a lot, and
              after banging my head against the wall for a long time I stumbled
              across an almost ridiculously easy way to tame them in both IE and
              Netscape 4.0+... No one around here (I live in the boondocks) uses
              any browsers other than IE and Netscape, and almost all are PC users,
              not Macs.. So I don't pay much attention as to how my sites display
              in other platforms as my targeted audience is primarily local folks..

              Anyway, here's a snippet of CSS from one of my style sheets..

              /* DIV IS USED FOR ABOUT US AND PRICING LINKS */
              .details td {
              border: 0px solid #000000;
              font-
              family: "Verdana", "Arial", "Georgia", "Helvetica", "Times", "Times
              New Roman", sans-serif, serif;
              font-size: 11px;
              color: #000000;
              background: #e3e0d5}

              Then in my HTML doc, I enclose one or more tables in between the
              following tags:

              <div class="details">

              </div>

              The result is all plain text in those table cells will display the
              same, black Verdana (or Arial, or Georgia, etc) at size 11 on an
              offwhite background..

              The bottom line is I use DIVs a LOT now in my CSS coding, especially
              for tables.... If this doesn't make any sense I won't be surprised
              as right now I'm really pounding this out in a hurry on my way out
              the door... But I'll be glad to go through it in more detail if
              you're interested...

              John :)



              --- In ntb-html@y..., Jody <av1611@e...> wrote:
              > Hi Guys and Gals,
              >
              > How do I define two tables in CSS?
              >
              > TABLE
              > {
              > width: 100%;
              > background-color: #99CCFF;
              > }
              > TABLE.2
              > {
              > width: 100%;
              > color: #white;
              > }
              >
              > If the second is correct what, tags do I use for it in <table> line?
              >
              > Thanks!
              > Jody
              >
              > Clean-Funnies: click and send...
              > mailto:c-f@S...?subject=Subscribe
            • Jody
              Dear John, ;) ... I ve noticed that is quite a good one to use. The only problem now is trying to get some work around in CSS for border: in
              Message 6 of 6 , Sep 28, 2001
              • 0 Attachment
                Dear John, ;)

                >I know the frustration of tables and CSS.. I use both a lot, and
                >after banging my head against the wall for a long time I stumbled
                >across an almost ridiculously easy way to tame them in both IE and
                >Netscape 4.0+...

                I've noticed that <div ...> is quite a good one to use. The only
                "problem" now is trying to get some work around in CSS for
                "border:" in NS4.xx As I mentioned, Lotta got me straight on
                using letters in TABLE.aaa, TABLE.bbb, etc. I spent about 10
                hours trying to get the thing to work and it was because TABLE.1
                (TABLE.plus a number) does not work. I guess it, the numbers,
                are reserved for something else. I think it is time to use a
                javascript to switch over to a regular HTML table for NS4.8 and
                below. Somebody, I think Stephen sent me a script to try, but I
                have not had the time yet..

                >Anyway, here's a snippet of CSS from one of my style sheets..
                >
                >/* DIV IS USED FOR ABOUT US AND PRICING LINKS */
                >.details td {
                >border: 0px solid #000000;
                >font-
                >family: "Verdana", "Arial", "Georgia", "Helvetica", "Times", "Times
                >New Roman", sans-serif, serif;
                >font-size: 11px;
                >color: #000000;
                >background: #e3e0d5}
                >
                >Then in my HTML doc, I enclose one or more tables in between the
                >following tags:
                >
                ><div class="details">
                >
                ></div>

                >The bottom line is I use DIVs a LOT now in my CSS coding,
                >especially for tables....


                Happy HTML'n!
                Jody

                http://www.notetab.net

                The NoteTab and Html List...
                mailto:Ntb-html-Subscribe@yahoogroups.com
                mailto:Ntb-html-UnSubscribe@yahoogroups.com
              Your message has been successfully submitted and would be delivered to recipients shortly.