Page 1 of 1

My XHTML Tables and Forms Are Suck

Posted: Sun Sep 07, 2008 9:40 pm
by supermike
I'd love to see some CSS that styles tables (tabular data) and forms in a modern, Web 2.0 way. I'm needing to upgrade my themes. Anyone got any samples that they recommend?

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 6:40 am
by JAB Creations

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 9:37 am
by supermike
JAB Creations wrote:You may fancy my website then...
Sorry, but that didn't seem to work out. This is what it looks like on Ubuntu Linux with FF3:
middle.png
middle.png (82.84 KiB) Viewed 1510 times
And the footer looks like:
footer.png
footer.png (10.11 KiB) Viewed 1510 times

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 9:53 am
by JAB Creations
You have referrers disabled.

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 11:01 am
by supermike
In FF3, here's my setting:

network.http.sendRefererHeader = 1

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 11:10 am
by supermike
On tables, so far I like the way columns are handled at the bottom of this page:

http://fluidmind.org/test/css/tables.html

And then I like this mediagroove theme too, although I would probably swap the orange with some other color:

http://icant.co.uk/csstablegallery/index.php?css=79#r79

So I like alternating rows and columns, and this use of a mild gradient at the top of each row.

I'm still looking for the best column headers, though.

As for forms, I like how people are putting subtle gradients at the top of them like the one above the word "Vintage":

http://www.arsgeek.com/2008/09/06/vinta ... tain-kirk/

which uses:

http://www.arsgeek.com/wp-content/theme ... -trans.png

Although I'm still looking for the best field styling.

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 11:40 am
by JAB Creations
Set it to 2 and reload the page.

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 12:11 pm
by supermike
I've restyled my forms to something suitable. Let me know if you like it.
sampleform.png
sampleform.png (4.93 KiB) Viewed 1480 times
The HTML and CSS are attached to this message.

Note I didn't do any styling on the button except to add some padding and change the font. This is because all browsers besides IE6 and 7 now style default buttons rather nicely and blend them in with the desktop interface. But on IE8, we shall see if Microsoft gets with the program and follows suit.

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 12:15 pm
by supermike
JAB Creations wrote:Set it to 2 and reload the page.
Okay, did that like you said.

Well, a little better, but still have text showing up on top of other text.

I also went to your default website and it's saying something to the effect that hotlinking is disabled and costing you bandwidth cash, and the text is jumbled up on top of other items.

Re: My XHTML Tables and Forms Are Suck

Posted: Mon Sep 08, 2008 1:57 pm
by JAB Creations
Typically you'll have to reload the page because Gecko doesn't send the referrers in some circumstances.

Try a fresh profile for Firefox, it should do the trick. It kind of sounds like you have some over-zealous privacy extension, plugin, etc installed that is messing with your current profile.

I giving your labels styling, float, display as a block, a border, and some other things I do with mine. If you load my site with Safari I really like how it triggers each field's hover/focus pseudo-element when merely moving the mouse cursor over it's associated label. Remember to use the label's for attribute in conjunction with the id of the associated input field.

Re: My XHTML Tables and Forms Are Suck

Posted: Tue Sep 09, 2008 9:08 am
by matthijs
It's kind of difficult to have a single (or even a few) default form and table styling. How they should look should totally depend on the general design of the site and page, the context in which the table/form is used, it's purpose, etc.

With tables, it will depend on it's data how you style it. Is the table showing horizontal data rows, vertical data rows, are some data more important, what is the purpose of the table, etc etc

The same with forms. Who is going to use the form? In which context? How often? What is the purpose of the form?