Topic: Tables to CSS (did I do it right?) Pages that link to <a href="https://ozoneasylum.com/backlink?for=21947" title="Pages that link to Topic: Tables to CSS (did I do it right?)" rel="nofollow" >Topic: Tables to CSS (did I do it right?)\

 
Author Thread
I X I
Paranoid (IV) Inmate

From: beyond the gray sky
Insane since: Apr 2004

IP logged posted posted 05-26-2004 07:35 Edit Quote

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)

Tyberius Prime
Paranoid (IV) Mad Scientist with Finglongers

From: Germany
Insane since: Sep 2001

IP logged posted posted 05-26-2004 08:13 Edit Quote

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

Lurch
Paranoid (IV) Inmate

From: Behind the Wheel
Insane since: Jan 2002

IP logged posted posted 05-26-2004 09:37 Edit Quote

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/


I X I
Paranoid (IV) Inmate

From: beyond the gray sky
Insane since: Apr 2004

IP logged posted posted 05-26-2004 10:46 Edit Quote

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)

LaSun
Bipolar (III) Inmate

From: the oceanic antipodes
Insane since: Sep 2001

IP logged posted posted 05-27-2004 13:36 Edit Quote

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...//

Rinswind 2th
Maniac (V) Inmate

From: Den Haag: The Royal Residence
Insane since: Jul 2000

IP logged posted posted 05-27-2004 23:08 Edit Quote

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)

I X I
Paranoid (IV) Inmate

From: beyond the gray sky
Insane since: Apr 2004

IP logged posted posted 05-28-2004 08:53 Edit Quote

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)

LaSun
Bipolar (III) Inmate

From: the oceanic antipodes
Insane since: Sep 2001

IP logged posted posted 05-28-2004 13:13 Edit Quote

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 //



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu