spacing issues w/ CSS1+tables: 1 Safari, 1 all browsers

[metoikos]

I've scoured the web (clumsily, I'm sure) for information on the
difficulties I am having, checked my markup in validators, and had a
friend with more CSS clue look over it, but I haven't had any luck.
I'll detail my difficulties here and hope for help. I will note that
I'm using headings to delineate different sections of my message for
easier reading.

As you can see from the subject, my problems are related to spacing;
one of them is pretty generalized, and one is specific -->
+++Browsers Involved+++

separately to my page's performance in what I suspect is Safari 1.0 on
Mac OS X 10.2.8 (it is my client's machine and I haven't been able to
get a browser version number from her, but judging from the Safari
version history as tied to OS releases, and my knowledge of when said
client bought her machine, its a good guess).

The general spacing issues show up in a different form with all other
browsers I have tested the page with. I will state for reference that I
am generally ignoring IE for Mac and haven't even considered more
marginal browsers like iCab or Opera, but I checked Netscape
perfunctorily and have been developing with Firefox 1.0.5, which
consistently displays that spacing error.
+++What it looks like+++

The more general spacing issue is that there's a gap I cannot eliminate
between my tabs and the divider bar, and another between the divider
bar and the sidebar, all of which are supposed to look unified. I will
admit I got my tabs styling from A List Apart, but I've messed with
them a bit and it doesn't _look_ like they're the issue.

The Safari spacing issue is that my tabs and my little puny utility nav
get sucked into the upper left hand corner. I'm curious in general
about the implementation for CSS in Safari, which I don't like to use,
and I still as of yet have insufficient clue to work around. I've only
been doing CSS for a few months, so I'm nowhere near being able to
perform browser hacks.

For reference, the Safari issue looks like this
You can view the page at
http://www.dogsolitude.org/metoikos/...fari_issue.jpg) and the css at
http://www.dogsolitude.org/metoikos/...ocec_alpha.css

The "everything else" issue you can see if you look at the site.

You can view the page at www.dogsolitude.org/metoikos/ocec/html
and the css at
http://www.dogsolitude.org/metoikos/...ocec_alpha.css

Yes, I have intentionally buried this page, but my permission settings
should allow you to view it.

+++My comments, and the non-useful validation responses I recieved+++

I'm darn sure the issue isn't in the HTML because there really isn't
much there, and nothing I can think of that could effect the spacing or
layout in that way. You can tell the Safari problem is pretty clearly a
CSS issue just from looking at it. I will note that I am using tables
with my CSS because I don't yet have enough clue to do positioning with
CSS only, although I attempted that in the beginning. It was so
difficult that I finally gave up.

I have put the sheet through two different validators, but the
information I got of them wasn't entirely helpful.

Issues they flagged were:
They didn't like that I didn't specify background colors in a bunch of
places,
they don't like a few places I was fairly redundant (couldn't list
attributes as at least one book said I could, so ended up doing that
just to make it work at first, know I have to clean it up),
and they also picked up on some places I and a friend had tipped in
"spacing 0" bits to try and deal with the gappiness at the top without
success, although I'm afraid to pull that stuff now even so, even
thoughn a validator said it.

+++My Questions+++

So, once you've looked at my markup, my questions are:

1) Could the spacing 0 bits still be adding to the issue, even though
they were added as we went through trying to get rid of everything
causing it?

2) Why is the Safari bug happening? Is it fixable, and should I bother
fixing for it?

3) Why is the spacing issue happening?

***4) In addition, and this is a sidenote I dumbly left out, I can't
ever seem to get my sidebar to be long enough for the page. I've tried
setting it at a ridiculous number of pixels, and I've tried setting it
to 100%. ***

Thanks for your help in advance!

Best
metoikos

[metoikos]

yes, I know I was redundant on the URLS, but at least they're there.

[kchayka]

metoikos wrote:

I've scoured the web (clumsily, I'm sure) for information on the
difficulties I am having, checked my markup in validators, and had a
friend with more CSS clue look over it, but I haven't had any luck.

You can view the page at www.dogsolitude.org/metoikos/ocec/html
You need to fix all your syntax errors before you can deal with logic
errors.

- HTML 4.01 DOCTYPE with XHTML syntax, e.g. <br />
- Invalid HTML elements, e.g. "breadcrumb", "squib", etc.
- Invalid CSS properties, e.g. "spacing"
I'm darn sure the issue isn't in the HTML because there really isn't
much there,
You can't just make things up and expect browsers to know what it is you
expect of them. A conforming browser should ignore anything it doesn't
understand. HTML is not XML.
I have put the sheet through two different validators, but the
information I got of them wasn't entirely helpful.
The W3C CSS validator reports:
http://dogsolitude.org/metoikos/ocec...ocec_alpha.css
* Line: 313 Context : table
Property spacing doesn't exist : 0

What part about "Property spacing doesn't exist" is confusing to you? It
simply means there is no such property. I don't really know what it is
you're trying to achieve here, or I'd suggest a more correct property.
Maybe margin, but who knows...
2) Why is the Safari bug happening?
I doubt it's a bug. Safari is probably doing the best it can with
invalid markup.
Is it fixable, and should I bother fixing for it?
I think Safari is the least of your worries. Have you looked at this
page in IE6? mozilla doesn't look like your screenshot either. I don't
know how you *intend* it to display, so it's hard to make suggestions.
I can't
ever seem to get my sidebar to be long enough for the page. I've tried
setting it at a ridiculous number of pixels,
You would do well to learn how to stop relying on pixels for everything.
Fixed sizes and positions contribute to your problem, I'm sure.
<URL:http://www.allmyfaqs.net/faq.pl?AnySizeDesign>
Thanks for your help in advance!

Instead of trying to reinvent the wheel (and failing), why don't you
just go find a 3-column template and adapt it for your use?
<URL:http://css-discuss.incutio.com/?page=ThreeColumnLayouts>

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

[metoikos]

Thank you for your half helpful, half snarky advice. I won't be
imposing my stupidity on this forum again.

[Beauregard T. Shagnasty]

metoikos wrote:

Thank you for your half helpful, half snarky advice.
Maybe succinct, but certainly good advice. You should heed what kchayka
said.

You also want to add a background color for the body. My default purple
makes your page look pretty ugly.
I won't be imposing my stupidity on this forum again.

Your loss.

But if you do decide to return, had a read of this first. Thanks.
http://safalra.com/special/googlegroupsreply/

--
-bts
-Warning: I brake for lawn deer