Skip navigation
sandanz
Currently Being Moderated

Table in Div

Jan 3, 2008 7:47 AM

I have tables nested in an AP Div. The table width is set in CSS. It renders ok in browsers, but on my local site the table is 1800 or more pixels, extends past the div it is nested in, and I can't adjust column widths.

Also, can't figure out how to center table within div.

http://www.viva-city.info/cityLife_civic.htm
 
Replies
  • Currently Being Moderated
    Jan 3, 2008 7:59 AM   in reply to sandanz
    Here's why you may not want to do this -

    http://www.great-web-sights.com/g_layer-overlap.asp

    Anyhow, this CSS rule is causing your problem -

    #table, tr, td {

    border: 1px solid #b8b8b8;

    background-color: #131313;

    td padding: 6px;

    width: 600px;

    padding-top: 2px;

    padding-right: 2px;

    padding-bottom: 2px;

    padding-left: 4px;

    background-position: center;

    }

    It's setting your <td> widths to 600px.

    In general you have WAY TOO MUCH (verbose and redundant) CSS in there....


    --
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs, Tutorials & Resources
    ==================


    "sandanz" <webforumsuser@macromedia.com> wrote in message
    news:flj03e$goi$1@forums.macromedia.com...
    >I have tables nested in an AP Div. The table width is set in CSS. It
    >renders ok
    > in browsers, but on my local site the table is 1800 or more pixels,
    > extends
    > past the div it is nested in, and I can't adjust column widths.
    >
    > Also, can't figure out how to center table within div.
    >
    > http://www.viva-city.info/cityLife_civic.htm
    >

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 3, 2008 8:38 AM   in reply to Newsgroup_User
    The rule I quoted does ever so much more than that. If you want that rule
    to apply only to the table tag, it should be like this -

    table {
    border: 1px solid #b8b8b8;
    background-color: #131313;
    width: 600px;
    }
    td {
    padding: 2px 2px 2px 4px;
    background-position: center;
    }

    although I'm not clear on where the background position should be placed,
    since I don't know if you intended it to apply to the <table> or the <td>.

    Note also that you used an octothorpe ("#") as the first character of your
    selector which, in this case, was inappropriate since that looks for an
    element with id ="table", and you are wanting to just style the table tag -
    <table>. In this case, you would just use a tag selector - 'table'.

    --
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs, Tutorials & Resources
    ==================


    "sandanz" <webforumsuser@macromedia.com> wrote in message
    news:flj135$hri$1@forums.macromedia.com...
    > So how do I write a CSS rule to set the border colors, padding, and table
    > centered within div?
    >
    > Sorry, I'm new at this.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points