Welcome to Geeklog Wednesday, November 25 2020 @ 03:26 pm EST

Geeklog Forums

100% CSS Sites?


Gwen

Anonymous
Hi, I was wondering if anyone has succeded in getting GL running with a 100% Standards somplient layout. What I mean by that specifically is no tables used for layout purposes. I've looked through a bunch of themes, but they all seem to be table dependent. I'm trying to do this from scratch, but am failing miserably. Any thoughts?
 Quote

Status: offline

Dirk

Site Admin
Admin
Registered: 12/01/02
Posts: 13073
Location:Stuttgart, Germany

It's possible (and not too hard) to make a theme compliant to the HTML and CSS standards, so that it passes the tests by the W3C's HTML validator and CSS validator.

Some themes are pretty close to that (e.g. Yahoo or my own ClearBlue theme) and only contain compr0mises like li tags without surrounding ul tags ...

Making a theme that does not use tables may be harder, but it should be possible (although some tables are still hard-coded in Geeklog's source code). Making a theme that does not use tables for the front page is certainly doable.

What have you tried so far and what did not work for you?

bye, Dirk

 Quote

Gwen

Anonymous
The tables that are hardcoded into the source are a source of problems, I think. They are designed to go inside other tables, but when you take them out, they stop working well. As for what I have tried, I have a big mess. If you'd really like to see it, try http://www.manufacturingdissent.org/index.php If you go there, create a useraccount and select the theme "gwen", you can see what I have. The stylesheet's URL is http://www.manufacturingdissent.org/layout/gwen/style.css I've tried a few different methods of positioning but they all turn out more or less the same. I think one of the problems is that those tables that are still there have things like 100% widths, which work fine within other tables, but not within divs.----- <br></br> Gwen
 Quote

Status: offline

Dirk

Site Admin
Admin
Registered: 12/01/02
Posts: 13073
Location:Stuttgart, Germany
Well, it's not that bad ... The index page seems to be free of tables, so any problems you have there are probably with your CSS. Pages like the user preferences are a different beast. They still contain hard-coded tables and I guess for the time being that is not going to change ... Actually, I'm glad you tried to go all CSS. I was long hoping that someone tried this so that we could see where the problems are (and maybe even learn something for Geeklog 2). After seeing your attempts, I still think it is possible to create an index page that uses only CSS. For some other pages, however (user preferences, for example), this won't work. Let me know if you hit any problems with hard-coded HTML and I'll see what I can do ... bye, Dirk
 Quote

Status: offline

moyashi

Forum User
Junior
Registered: 10/10/02
Posts: 16
Nice idea! Only thing is that many people who are using older systems and especially older browsers will be a problem. Hmm, making duplicates of some of the files might be a long way around this.
 Quote

Status: offline

Dirk

Site Admin
Admin
Registered: 12/01/02
Posts: 13073
Location:Stuttgart, Germany
This would only be a theme - you could always provide a second theme for users of older browsers. bye, Dirk
 Quote

Status: offline

saltlakejohn

Forum User
Newbie
Registered: 17/12/01
Posts: 9
Location:Utah, USA
Check out two- and three-column CSS table-less layouts at :: http://www.bluerobot.com/web/layouts/ http://glish.com/css/ http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html Some of the variables you would use to plug GL data into your own page design are listed at http://www.geeklog.net/docs/themevars.html I've been playing with one of the bluerobot layouts at irtnog.com (running b2/CafeLog). The stylesheet for it is irtnog.com/style.Alice.css named after the lady that requested those odd colors. In the next week of so I'll start playing with tableless layouts for GL.

---
-- John


-- John
 Quote

Anonymous

Anonymous
I tried doing that. One of the big problems I ran into was blocks appeared in different sizes which made for an ugly layout. Some browsers like IE do not render the minwidth attribute properly so it requires using a graphic or hr to keep the widths constant. It was a pain trying to carry this through the entire site. When the screen was resized some things collapsed funny. Plus most of the CSS doesn't work on older browsers. 100% CSS is a nice idea but I have yet to see anyone get it to work on complicated layouts. There's no problem making basic two and three columns look nice but try adding all the blocks so they look decent. If you get this to work, I'd be interested in seeing it.
 Quote

Anonymous

Anonymous

Let's not forget the plugins either. Try doing this screen on the weather block without any tables. It's tough.

If you look around, most of 100% CSS sites are very plain. It's hard doing complicated designs, but if you can get it to work that here would be great.

 Quote

EsmereldaPea

Anonymous

Hey, Gwen and SaltLakeJohn -

Was just wondering what the status was of your 100% CSS attempts for layout of Geeklog - something I really want to do! Have either of you read Eric Meyer on CSS: Mastering the Language of Web Design or do you visit Jeffrey Zeldman's site regularly? Great resources for working out your CSS woes.

 Quote

Status: offline

jonimueller

Forum User
Junior
Registered: 28/11/02
Posts: 17
Another place to look for just how unique and breathtaking pure CSS can be, check out:

The CSS Zen Garden

Joni
My Geeklog Site: http://www.ro-jo.net.com/geeklog/
 Quote

All times are EST. The time is now 03:26 pm.

  • Normal Topic
  • Sticky Topic
  • Locked Topic
  • New Post
  • Sticky Topic W/ New Post
  • Locked Topic W/ New Post
  •  View Anonymous Posts
  •  Able to post
  •  Filtered HTML Allowed
  •  Censored Content