Topic: Tables to CSS (did I do it right?)

My personal site used to be one big table hack, I had something like 6 nested tables in ONE page.
I used images and frames for the navigation, in conjunction with javascript rollovers to get the links to "light up" when the mouse moved over them.
I thought that page was the greatest when I first made it.
I've since traded in my nested tables, javascript rollover buttons and frames for simple html and css.

Please have a look and be as brutal as you'd like.
http://ixi.dacryonic.net/
or
http://www.dacryonic.net/subdomains/ixi/ if the first doesn't work for some reason...

I was using a green on black "marble" color scheme and I opted for simple text when I tried to show someone else the site from their house. it took almost 2 minutes to load for the first time on a 56k connection.

any comments/criticisms (as always) are greatly appreciated.




...Of all the things I've lost, I miss my mind the most (ozzy osbourne)

well... the site doesn't validate (quick check via opera - press ctrl-alt-v) - therefore you 'obviously' didn't do it right ;-)

as TP said...

doesn't validate even as HTML 4.01 - http://validator.w3.org/check?verbose=1&uri=http%3A//ixi.dacryonic.net/

and the css doesn't validate - http://jigsaw.w3.org/css-validator/validator?profile=css2&warning=2&uri=http%3A//ixi.dacryonic.net/

well, it took me a while to figure out what was needed, but honestly it was a bit of sillyness that was causing the files to not validate

missing alt tags for the images, missing doctype and missing charset... all are now fixed

PLEASE TRY AGAIN

[edit] I know, all of those are important to creating a worth-while internet [/edit]




...Of all the things I've lost, I miss my mind the most (ozzy osbourne)

(Edited by I X I on 05-26-2004 10:47)

i'm a big fan of css.. mostly cause i don't know much else. love the art and wish i could write programs.

just one thing: i'm getting squished images on my 800x600 screen resolution.. what's that one 'liquid' thing you can do with tables again?


sun
//striving to be helpful...//

Some quick comments:
The links are to big, the h1 heading does Not scale very well.
The header graphic is a bit jagged.

Wondering if the Em fontsize could be the problem i did some reading at Alistapart and i did fiddle with it (thanks to the edit-css exteension from firefox). Basicly al the ems in your document are relative . And since the C from css is for cascading they will be relative to the parent container eg the fontsize in the body tag. According to the above ALA article setting the first fontsize to % will solve some troubles. So i changed your stylesteet like this:

quote:

---

body {
font-family: 'Courier New', Serif;
font-weight: bold;
font-size: 80%;
text-align: left;
color: #C0C0C0;
background-color: #000000;
}

---

Thus the base fontsize is a bit smaller.
To let the h1 scale better i changed it's fixed size (3em) to the more flexible size keywords thus:

quote:

---

}

h1 {
border-left: double;
border-top: double;
border-right: double;
border-bottom: double;
font-weight: bold;
font-size: xx-large;
text-align: center;
color: #C0C0C0;
}

---

This is a longshot but it seems to scale better when switching to 800*600 or smaller.
However the heading might stiil break out the box when the siet is shoen in ean even smaller window.
My sugesstion would be to set some padding an margins for to all the divs to make sure they wil not overlap when page is scaled down.
------------------------------
Do something usefull: support Justice for Pat Richard

(Edited by Rinswind 2th on 05-27-2004 23:12)

thanks for the c&c

I hadn't even thought of checking it out @ 800x600

quote:

---

LaSun said:

what's that one 'liquid' thing you can do with tables again?

---

yeah, I'm not so sure I know what you're talking about here...




...Of all the things I've lost, I miss my mind the most (ozzy osbourne)

oh ... it's just setting your tables to 'flow' into any resolution screen. in a tute i saw once, they called it 'liquid' .. can't remember how to do it though.

sun
//not being as helpful as she thought //