Blog Documentation Book a Demo
Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

@#$%*! CSS Table Model...

BergamotBergamot
edited January 2006 in Vanilla 1.0 Help
I've been trying to solve this for a few hours now, with no luck.

Problem:
image

I want the 2px spacing *between* cells to stay there, but the 2px spacing around the whole table to disappear. At the very least, I want the spacing on the left and right edges to be gone.

I've tried every combination of CSS properties and evil html attributes I can think of, to no effect. Initially i thought I could set border-spacing to 0 and give the cells a margin, but margins apparently don't work with table cells. This was tested in both IE6 and Firefox.

Help!

Comments

  • MarkMark Vanilla Staff
    I don't know if this will help, but I *always* declare my tables like:

    <table border="0" cellpadding="0" cellspacing="0" class="MyTableClass">

    Then use css to make the table look however you want. I've had big headaches if I don't do it this way.
  • BergamotBergamot
    edited January 2006
    Two problems with that:

    1. IE ignores the border-spacing CSS property, as far as I can tell.
    2. Firefox treats border-spacing like cell spacing and applies it to the table edges as well as the cells.

    I'm about ready to just give it an ugly hack...
  • timberfordtimberford
    could you provide your markup and css bergamot? or a link to it?
  • BergamotBergamot
    edited January 2006
    Oops...

    Link

    The CSS is in there too.
  • MarkMark Vanilla Staff
    Noice
  • BergamotBergamot
    What I might do is apply the border to the *contents* of the cells, and give the cells beige borders to simulate spacing.
  • timberfordtimberford
    how about moving: background-color:#FFF4C8;

    from table.calendar to table.calendar td.past

    it's pretty close to what you want.
  • BergamotBergamot
    edited January 2006
    Mainly because I want the cells to collectively be 504 pixels wide, to match everything else in the column.

    The beige background was just to show where the spacing was; on the real page, the whole background is that color.

    The calendar goes right below the logo.

    I'm gonna give my border idea a shot.
  • BergamotBergamot
    It *almost* worked for a second, then I changed something and it broke.
  • BergamotBergamot
    Meh, I just ended up faking it.
  • BergamotBergamot
    edited January 2006
    Link to the finished version, connected to the DB and everything.

    Next stop: using People sessions to allow users to register for events.
  • nick1prestanick1presta
    table { border-collapse: collapse; margin: 0 -2px; } td { margin: 2px; }
  • BergamotBergamot
    Cells can have margins when border-collapse is on?
  • MarkMark Vanilla Staff
    That's a pretty sweet looking site, Bergamot. I like where you're going with the vanilla design, too.
  • NickENickE New
    The discussion page looks awesome, but it appears you haven't quite gotten around to the categories and search page yet...
  • MinisweeperMinisweeper New
    I must say it is a very well integrated forum. Best i've seen for sure. You could almost be convinced it wasnt vanilla (i didnt check search and cat, mind)
This discussion has been closed.