
|
View Full Version : HTML and CSS tables question
donxyz 05-27-2004, 02:56 PM I am trying to use style sheets to control where stuff goes on my site. However, I am having one particular problem.
I have a table to display, but I don't want to use the table tag. Instead, I've been using the float property in CSS to control what's on the left side and right side. The problem is that when I want to start a new row, the browser is showing the new row underneath the shortest cell (height-wise) in the previous row instead of showing the new row underneath the tallest cell (height-wise) in the previous row.
Here's the site in question (http://www.donortega.com/missingjimmy/site/discography)
Here's the code for the content portion of the page (http://www.donortega.com/missingjimmy/discography/main.php)
Here's the style sheet (http://www.donortega.com/missingjimmy/default.css)
I thought using the <p> tag would work but it didn't.
thanks for any tips.
Zopester 05-28-2004, 06:02 AM ok, the problem is this: Your using CSS for layout (great by the way!) but you're still coming at the design from a tables-for-layout perspective.
I could have gone into great detail here about what to change, and maybe we would have got somewhere close by about Christmas, so instead I've taken the liberty of producing what I think is a pretty good version of the site. It's at: http://www.kinkamono.com/design/examples/missingjimmy/
It's valid XHTML Transitional 1.0 (http://validator.w3.org/check?uri=http%3A%2F%2Fwww.kinkamono.com%2Fdesign%2Fexamples%2Fmissingjimmy%2F&charset=%28detect+automatically%29&doctype=%28detect+automatically%29&verbose=1) and valid CSS (http://jigsaw.w3.org/css-validator/validator?profile=css2&warning=2&uri=http%3A//www.kinkamono.com/design/examples/missingjimmy/). If you do decide to use it, a credit would be appreciated.
Instead of trying to replicate a table layout, I've used a couple of floats for the main section. You may also want to take a look at the redesigned menu bar - in my version it's simply an unordered list, styled using CSS.
I've used an ordered list for the track listing (it is a list, after all!), and...well dig around in the source code! Have fun, knock yourself out, etc etc.
Hope that helps. It's a Friday. I'm in a good mood! :D
Gen-T 05-28-2004, 06:24 AM donxyz, you should be quite proud. Zopester normally charges an arm and a leg for his code expertise.
I know...... because I'm typing this with my nose. ;)
Zopester 05-28-2004, 06:34 AM Zopester normally charges an arm and a leg for his code expertise.
Oi you! You got a damn good deal and you know it! :D
Whyioughta...!
Zopester 05-28-2004, 06:36 AM Incidentally, one thing I did forget to mention is this version of the site is fluid in width. Try resizing your browser and you'll see what I'm on about. It works all the way down to 800x600.
Hurga 05-28-2004, 11:47 AM Make sure to test it out with multiple browsers. I know some CSS stuff works only with IE, and looks terrible on Safari, Netscape, Opera, etc.
Zopester 05-28-2004, 11:54 AM Make sure to test it out with multiple browsers. I know some CSS stuff works only with IE, and looks terrible on Safari, Netscape, Opera, etc.
I do believe I'm big enough to not take that as an insult! However, I do feel it necessary to point out that I'm not just some rank amateur. This is my business. I know CSS and XHTML extremely well.
I design using Mozilla as a base, and introduce whatever CSS workarounds are necessary to get a site to work in IE. As it turns out, this was a simple layout using a couple of floats, and displays equally well in IE5/5.5/6 as well as Opera and Mozilla all on Windows. As for Safari, maybe someone with a Mac can comment, or alternatively use http://www.browsercam.com/. My own Mac remains in the "yeah, I'll get it when I can afford to spend $xxxx on a computer just for design testing" category.
Let me just address one final point. You say some CSS works only with IE. Correct. That would be non-standard proprietary CSS such as scrollbar-color etc. Support for standard CSS (ie ratified by the W3C) is better in non-IE browsers.
Just so we're clear.
Hurga 05-28-2004, 11:59 AM Hay Zopester.
Naw, actually it was for the guy who started the thread. Was just a small reminder.
Wasn't meant to slight your css expertise. :cool:
donxyz 06-01-2004, 04:52 AM Wow Zopester.
Thanks for the help. The site has since gone live with the old table format because I forgot I posted a thread here (oops). I will go back and try to make the changes.
I will not hesitate to credit you for the help. In what form would you like the credit to be?
Zopester 06-01-2004, 06:11 AM You're welcome. A link to the site in my sig would be lovely, thanks. :)
|