Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 15 of 15

Thread: CSS on a table

  1. #1
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question CSS on a table

    Can someone look at this code, and see if theres anything wrong with it(im fairly new to CSS), also what does "table-layout" do?

    Code:
    .table {width: 100%; cellspacing:0; cellpadding:0; align:100%; font-size:medium; }

  • #2
    Regular Coder Rappa's Avatar
    Join Date
    Nov 2005
    Location
    LI
    Posts
    356
    Thanks
    21
    Thanked 9 Times in 9 Posts
    Looks good to me.

    I personally like it all not on one line:
    Code:
    .table {
    width: 100%; 
    cellspacing:0; 
    cellpadding:0; 
    align:100%; 
    font-size:medium;
     }
    but thats up to you.

    as for your other question:

    http://msdn2.microsoft.com/en-us/library/ms531161.aspx

  • #3
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Rappa View Post
    Looks good to me.

    I personally like it all not on one line:
    Code:
    .table {
    width: 100%; 
    cellspacing:0; 
    cellpadding:0; 
    align:100%; 
    font-size:medium;
     }
    but thats up to you.

    as for your other question:

    http://msdn2.microsoft.com/en-us/library/ms531161.aspx

    it says "it renders by default with width=100%." if no layout is specified, so do ireally need the "width:100%" in there, also i want to align the table in the center, would i put that in the CSS - "align:center" or do i put the commands "<center></center>" at the beginning and end of the table

  • #4
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    when referencing to the CSS table, i use this <table class="table">, do i have to put the class in the <tr> and <td> fields too

  • #5
    Regular Coder Rappa's Avatar
    Join Date
    Nov 2005
    Location
    LI
    Posts
    356
    Thanks
    21
    Thanked 9 Times in 9 Posts
    you dont need the width="100%", but i dont see the difference if its there or not, except the file size. besides if you want to make it a different width then you dont have far to go.

    if you want to center your table, you can do it with css, or:

    Code:
    <table align="center">
    works too.

  • #6
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    this CSS is not working, dont know why..
    Code:
    .table1 { cellspacing:0; cellpadding:0; align:center; font-size:medium; width:100%; border:1; bordercolor:#0099cc; }
    and to reference that, im using..
    Code:
    <table class="table1"><tr><td>etc..

  • #7
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok, i got it to work, my next question is how to show all the lines between the cellls, it only shows the outside border of the table

  • #8
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    Well, I'd suggest you validate that code you've got there before continuing. Cellpadding and -spacing are not valid CSS properties. Same thing goes for align and bordercolor. Also, you must specify a unit in the border property.

    To make borders show inside the table instead of just around it, assign a border to the td element:

    Code:
    td {
    border: values here;
    }
    .
    .

  • #9
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i decided to just put the table properties in the table, instead of using CSS, i will only have three tables on the page, so I don't think the load time between having a CSS or not will make mush of a difference; my next question is how to change the font inside a table? this is my table..

    <table cellspacing="1" cellpadding="0" align="center" width="100%" border="1" bordercolor="#0099cc"><tr><td><img alt="Arrow" src=""> <b>Condition:</b> </td><td>Like New (<a onclick="win(600,600,this.href); return false;" href="">Condition Detail</a>)</td></tr><tr><td><img alt="Arrow" src=""> <b>Functionality:</b> </td><td>100%</td></tr><tr><td><img alt="Arrow" src=""> <b>Packaging:</b> </td><td>Original Packaging</td></tr></table>

  • #10
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    Assign an ID or a class to it and define the font family:

    Code:
    #table1 {
    font-family: Arial, Verdana, sans-serif;
    }
    .
    .

  • #11
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    what about font size, would i do the same thing; do i have to use CSS to do this, or is there a way to change a tables font without the use of CSS

    i want it to be the same font as the rest of my document, but everytime i make a table, the font inside the table gets bigger

  • #12
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    Just define a set font size under the body selector and this will be the standard size for all text, except for headings and such.

    Or you could just adjust it in .table1:

    Code:
    .table1 {
    font-family: Arial, Verdana, sans-serif;
    font-size: 0.9em;
    }
    .
    .

  • #13
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok great, got the tables to change font, but its not the exact same font size as the rest, what is the default/normal font size, what does "em" mean, ive seen CSS style sheets that have "px" in them

  • #14
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    The default is 1em. Em is a unit, but you can also use %. It is recommended not to use px, because IE users won't be able to resize the text then.
    .
    .

  • #15
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    as mentioned earlier cell spacing and padding are not CSS properties, can someone TRANSLATE this to a CSS style property..

    Code:
    <table width="100%" align="center" cellpadding="5" cellspacing="1">


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •