PDA

View Full Version : ACafe


[lhomme]
April 6th, 2002, 14:20
Ok - I need some advice (been needing that alot lately it seems ;) )

My site's layout looks pretty good in IE6 but I recently took a look using Mozilla and Opera and the site looks generally bad. What can I do to improve it in other browsers? (layout & design only plz). Or what can I do to improve it overall? Plz be specific. Thanks.
manni
April 6th, 2002, 14:31
Not bad layout. Looks nearly exactly same with IE and Opera 6.01. But if you want to improve compatibility with different browsers, you should check your site with W3C HTML Validator (http://validator.w3.org/) and do what you have to do to make your code perfect. Begin with charset & doctype.
Mekhu
April 6th, 2002, 15:29
Not a bad layout at all...

I think you really need the use of maybe 1 or 2 different colors though.
meow
April 7th, 2002, 07:00
Yes, it looks much the same to me too in both Opera and Moz. But since you are in the mood... ;)

You aren't helped by proprietary stuff like topmargin and leftmargin and your next stop after the URL manni suggested would be:
http://jigsaw.w3.org/css-validator/validator.html

What do you see that looks so bad btw? :confused:
manni
April 7th, 2002, 07:11
Originally posted by [lhomme]
What can I do to improve it in other browsers?

meow, as [lhomme] said, he asked about improving it with different browsers. Layout is very nice but to minimize problems with different browsers (I'm not talking only about newest IE / Opera / Mozilla) HTML code must be very correct.
meow
April 7th, 2002, 07:17
That's why I recommended the above URL. :confused:
[lhomme]
April 7th, 2002, 12:14
Ill look into your suggestions but I have a few questions: for Manni's validator, it required me to have a doctype before I could start validation. Course, I dont know what to use. :o

Now for some shorter questions:

The black lines in my designs are 1 pixel wide (or tall) <td>'s yet the horizontal lines are a lot fatter than the vertical. Why is that? (Netscape and Mozilla)

In IE, if you hover the mouse on one of the nav cells, it becomes the "hand" - how can I do that with other browsers?

In my stylesheet - all text in the nav menu on the left is supposed to be indented. This however, only seems to work in IE. How do I make it work with other browsers?

Also, does anybody have suggestions on how to make the site look less flat? Any use of graphics that I can think of just seems out of place and cluttered.

Thanks a bunch.
manni
April 7th, 2002, 12:34
You should use this as doctype:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Indents and other stuff can easily be made with CSS. Check a good guide here (http://www.htmlhelp.com/reference/css/).
meow
April 7th, 2002, 21:05
Originally posted by [lhomme]

The black lines in my designs are 1 pixel wide (or tall) <td>'s yet the horizontal lines are a lot fatter than the vertical. Why is that?

A guess is it's the old line breaks in the code within table cells. Try writing them on one single line.


In IE, if you hover the mouse on one of the nav cells, it becomes the "hand" - how can I do that with other browsers?
Because you use the MS proprietary "cursor: hand". Note that that's the only thing IE5x- understands though.
http://www.w3.org/TR/REC-CSS2/ui.html#propdef-cursor


In my stylesheet - all text in the nav menu on the left is supposed to be indented. This however, only seems to work in IE. How do I make it work with other browsers?
Sorry, but almost all your CSS is illegal. :classic2: Start over and check everything up with the CSS lint as you add it. That's actually a good way to learn. You can do what you want in lots of ways. Margin, padding...
trenzterra
April 7th, 2002, 21:36
Comments:
-Plain
-Not much graphics

Design: 600/1000
Graphics: 10/1000
Organised: 900/1000

Overall: 503/1000, 50%
meow
April 7th, 2002, 21:41
Trenzbaby...please read the question. In what way does your review help him? :biggrin2:
[lhomme]
April 8th, 2002, 17:07
Originally posted by meow

Sorry, but almost all your CSS is illegal. :classic2: Start over and check everything up with the CSS lint as you add it. That's actually a good way to learn. You can do what you want in lots of ways. Margin, padding...

Are you sure? The CSS links you gave me said that it was valid HTML (except for a few font family recommendations and a required background color thing which I do not which to add).
meow
April 8th, 2002, 17:22
Honestly I don't know - I just ran your site through the w3c validator and it didn't like it. Can't say I looked to close. Now it says everything is OK except the "cursor: hand". Sure you haven't changed anything? Or maybe I copied the wrong URL? :confused:

BTW, if you don't know, those warnings are warnings, not errors. Mostly you get them for the reason you get them now. You specify a color w/o a background color or vice versa. The reason is that if you use for example a grey text color and I happen to have my browser set to display a grey background instead of white it can end up being unreadable.
meow
April 8th, 2002, 17:30
Oh, the cursor thing - This won't validate but if IE5 is important to you you can do it like this (it won't screw anything up):

{ cursor: pointer; cursor: hand }

Good browsers will get "pointer" and ignore "hand" and bad old IE5 will do the opposite.

You said that get a warning about that you lack a generic font family. With the fonts you've chosen you should use "sans-serif" last in the rule. It's a good habit.
http://www.w3.org/TR/REC-CSS2/fonts.html#generic-font-families
[lhomme]
April 8th, 2002, 18:29
Originally posted by meow
Honestly I don't know - I just ran your site through the w3c validator and it didn't like it. Can't say I looked to close. Now it says everything is OK except the "cursor: hand". Sure you haven't changed anything? Or maybe I copied the wrong URL? :confused:


I did make some changes recommended by the checker but I was pretty sure I did it before your post so I wasnt sure... No biggy and thanks for the advice.