Re: [WSG] Somewhat frustrated

[Chuck]

On Monday, March 29, 2004, at 11:07  AM, John Penlington wrote:

Forgive my frustration, but after a couple of months with this 
Discussion List I've formed the opinion no browser will display web 
standards - every one of them requires hacks of some kind.
 
I test on Win XP Pro with IE6 and Firefox - as well as on a new eMac 
with Safari and IE5(Mac).
 
All my earlier web sites with tables rather than CSS 2 display quite 
well on all four browsers.
Well, in this case my IE 5.2 dosn't like your use of "position: 
relative; left: -24px;" on your "UL" setup (in both "UL" cases).

If you want to position the "UL", put it in a "DIV" container and 
position it.

 
When I try to code for Web Standards, I get a medley of results. Hence 
my opinion that no browser complies completely.
None ever will, unless the "Standards Committee" creates it's own 
...but that's another story for another day.

 
Now the crunch: I'm building a site for a photographer who wants 
pixel-precision layout on all browsers. At least we achieved it on IE6 
with no tables, just CSS styling.
I'm aware that I shouldn't have done that, but please read on.
(see  below)

 
After two weeks of frustration trying to get it to work precisely on 
the other browsers, I've finally resorted to tables and yes, wicked 
me, even a spacer gif.
The problem is that your page is only "pixel-precise" on a 96dpi system.
To be "pixel-precise" on all systems, you have to use "relative 
measurement" in your CSS (ie: em, %, and or keywords)

 
The home page (with inactive links) is at:
www.bluemountainsgardener.info/hobbs/index.asp
 
and the CSS is at:
www.bluemountainsgardener.info/hobbs/dhpg_style_tables.css
 
The display my client wants is exactly what you'll see with IE6.
 
What he doesn't want is what you'll see on Safari, Firefox and 
IE5(Mac).
Well, as you already know ...you have to start with a "standards 
browser" first and work backwards. This is even true with "tables".

 
The page validates for both XHTML 1.0 Transitional and CSS. Even the 
Unordered List menu breaks on IE5(Mac).
(see above)

 
Can anyone tell me why my valid (XHTML and CSS) page displays so 
differently in those four browsers - two of which are supposed to 
follow Web Standards closely (Firefox and Safari)?
(see above)

 
Where is my code sub-standard if it validates for both XHTML and CSS?
 
What do I need to do to get it to display roughly the same on all four 
browsers?  Please don't tell me to use CSS 2 - I tried that and it 
simply didn't work !! The variations were unacceptable despite all the 
hacks I could find.
Start with "ccs2" and a "standards browser" a include an import of 
"ie7-xml.css".
You can find this life-saver at: http://dean.edwards.name/IE7/intro/
Copy it from the "src" link in the breadcrump tail.


 
I know I'll be shot down in flames for raising this, but I really want 
to code for Web Standards and the frustration for me and my client 
is very real !!
So, ...do it in "tables" first, make it look on all, ...then take on 
CSS2.

 
I'm sure I'm not alone, but I'm keen to persevere.
Good luck and welcome to the club!!
-chuck
-a Mac guy-
 
Thanks to you all for such a helpful List.
 
John Penlington
web developer
 
 
 
 
 
 
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
*

Re: [WSG] Somewhat frustrated

[russ weakley]

John,

Yes, there are slight differences in browsers, but these are easy to
overcome. There are a lot of un-needed classes in your code. The aim is to
use as few as possible, and use descendant selectors to do their work.
Theoretically, for this layout you should only need a few id's on the
containers and the rest should fall into place.

I am happy to talk offlist about this if you want...

Now, some overall points about table use (more for the overall list):

1. although tables and spacer gifs are hacks (when ued for layout, rather
than tabular data), there are worse things you can do when developing sites.
While important, building to standards are only part of the overall picture
that includes good design, useable navigation systems, interesting and
accessible content etc.

2. there are some layouts that are easier to achieve using tables. That is a
fact. However, you CAN build layouts without hacks (or with minimal hacks),
that are stable across all major browsers. Hang in there. Eventually it all
clicks into place and it becomes much easier.

3. We have talked before on the list about the two extremes - on one end you
have traditional layouts (tables, font tags, image spaces etc) and the other
end are standards based layouts (css, accessible, valid, semantically
correct code). The aim is to move towards standards based layouts, but at
your own pace and comfort level. If you feel that you want to stay with
tables for layout and use CSS for all other aspects, this is still a major
improvement over traditional layouts.

4. the aim of this list is to encourage developers to move towards web
standard not to flame people who are having trouble. Hopefully we can keep
this attitude as it is one of the things that sets this list apart from many
others.

Russ



> Forgive my frustration, but after a couple of months with this Discussion List
> I've formed the opinion no browser will display web standards - every one of
> them requires hacks of some kind.
> 
> I test on Win XP Pro with IE6 and Firefox - as well as on a new eMac with
> Safari and IE5(Mac).
> 
> All my earlier web sites with tables rather than CSS 2 display quite well on
> all four browsers.
> 
> When I try to code for Web Standards, I get a medley of results. Hence my
> opinion that no browser complies completely.
> 
> Now the crunch: I'm building a site for a photographer who wants
> pixel-precision layout on all browsers. At least we achieved it on IE6 with no
> tables, just CSS styling.
> I'm aware that I shouldn't have done that, but please read on.
> 
> After two weeks of frustration trying to get it to work precisely on the other
> browsers, I've finally resorted to tables and yes, wicked me, even a spacer
> gif.
> 

*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
* 

Re: [WSG] Somewhat frustrated

[Luc]

Good evening Jeremy,
  
It was foretold that on 29-3-2004 @ 14:10:01 GMT-0600 (which was
22:10:01 where I live) Jeremy Flint would mumble:
  


JF> sure. why not.
  
 Thanks Jeremy. You described what i was thinking but couldn't get
 the words right :-)
 
-- 
Best regards,
 Luc
_

http://www.dzinelabs.com

Powered by The Bat! version 1.63 Beta/7 with Windows 2000 (build
2195), version 5.0 Service Pack 4 and using the best browser: Opera.

"Diplomacy - the art of letting someone have your way." - attributed
to Daniele Vare.

*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
* 

Re: [WSG] Somewhat frustrated

[Jeremy Flint]

sure. why not.

-
Jeremy Flint
www.jeremyflint.com


Luc wrote:
Good evening Jeremy,
  
It was foretold that on 29-3-2004 @ 12:29:47 GMT-0600 (which was
20:29:47 where I live) Jeremy Flint would mumble:
  


JF> BTW, even with tables, sites will look differently on different 
JF> browsers. You speak of having to use hacks to get CSS to render 
JF> correctly in all browsers. I think using a spacer.gif would be 
JF> considered a hack. Tables display just as differently as CSS can. 
JF> Different browsers sometimes handle table heights and widths 
JF> differently. Some may measure cellpadding or spacing differently.
  
 Jeremy, can i steal this comment to use it for my blog?
 
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
* 

Re: [WSG] Somewhat frustrated

[Luc]

Good evening Jeremy,
  
It was foretold that on 29-3-2004 @ 12:29:47 GMT-0600 (which was
20:29:47 where I live) Jeremy Flint would mumble:
  


JF> BTW, even with tables, sites will look differently on different 
JF> browsers. You speak of having to use hacks to get CSS to render 
JF> correctly in all browsers. I think using a spacer.gif would be 
JF> considered a hack. Tables display just as differently as CSS can. 
JF> Different browsers sometimes handle table heights and widths 
JF> differently. Some may measure cellpadding or spacing differently.
  
 Jeremy, can i steal this comment to use it for my blog?
 
-- 
Best regards,
 Luc
_

http://www.dzinelabs.com

Powered by The Bat! version 1.63 Beta/7 with Windows 2000 (build
2195), version 5.0 Service Pack 4 and using the best browser: Opera.

"I have great faith in fools - my friends call it self-confidence." -
Edgar Allan Poe.

*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
* 

Re: [WSG] Somewhat frustrated

[Jeremy Flint]

I am using Firefox and IE6 on win2k and i don't see a difference.

Aside from that, why would pixel-precision be needed on such an open 
layout? I mean, there aren't even any borders or anything.

Also, it would help to show us the page using all css, not the tables 
version.

BTW, even with tables, sites will look differently on different 
browsers. You speak of having to use hacks to get CSS to render 
correctly in all browsers. I think using a spacer.gif would be 
considered a hack. Tables display just as differently as CSS can. 
Different browsers sometimes handle table heights and widths 
differently. Some may measure cellpadding or spacing differently.

Hacks are only used in certain instances, and there are ways to work 
around most hacks, especially BMH.

Though again, I go back to the fact that the layout of the site you 
linked to does not really scream pixel precision to me.
-
Jeremy Flint
www.jeremyflint.com



John Penlington wrote:
Forgive my frustration, but after a couple of months with this 
Discussion List I've formed the opinion no browser will display web 
standards - every one of them requires hacks of some kind.
 
I test on Win XP Pro with IE6 and Firefox - as well as on a new eMac 
with Safari and IE5(Mac).
 
_All my earlier web sites with tables rather than CSS 2 display quite 
well on all four browsers_.
 
When I try to code for Web Standards, I get a medley of results. Hence 
my opinion that no browser complies completely.
 
Now the crunch: I'm building a site for a photographer who wants 
pixel-precision layout on _all_ browsers. At least we achieved it on IE6 
with no tables, just CSS styling.
I'm aware that I shouldn't have done that, but please read on.
 
After two weeks of frustration trying to get it to work _precisely_ on 
the other browsers, I've finally resorted to tables and yes, wicked me, 
even a spacer gif.
 
The home page (with inactive links) is at:
www.bluemountainsgardener.info/hobbs/index.asp 

 
and the CSS is at:
www.bluemountainsgardener.info/hobbs/dhpg_style_tables.css 

 
The display my client wants is exactly what you'll see with IE6.
 
What he doesn't want is what you'll see on Safari, Firefox and IE5(Mac).
 
The page validates for both XHTML 1.0 Transitional and CSS. Even the 
Unordered List menu breaks on IE5(Mac).
 
Can anyone tell me why my _valid_ (XHTML and CSS) page displays _so 
differently_ in those four browsers - two of which are supposed to 
follow Web Standards closely (Firefox and Safari)?
 
Where is my code sub-standard if it validates for both XHTML and CSS?
 
What do I need to do to get it to display roughly the same on all four 
browsers?  Please don't tell me to use CSS 2 - I tried that and it 
simply didn't work !! The variations were unacceptable despite all the 
hacks I could find.
 
I know I'll be shot down in flames for raising this, but I really want 
to code for Web Standards and the frustration for me and my client 
is very real !!
 
I'm sure I'm not alone, but I'm keen to persevere.
 
Thanks to you all for such a helpful List.
 
John Penlington
web developer
 
 
 
 
 
 
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
* 

RE: [WSG] Somewhat frustrated

[Chatham, Will]

Hi John,
I understand your frustrations.  Let me respond to a few things you said.

>Forgive my frustration, but after a couple of months with this Discussion
List I've formed the opinion no browser >will display web standards - every
one of them requires hacks of some kind.

This is true of non-standard complaint pages as well.  Considering that
table layouts are 'hacks' by nature, it's even more true.

I know that a CSS-based layout is the light at the end of the tunnel, but
consider that it's still acceptable in many circles to use a table for
overall layout purposes (a header, two columns, and a footer, e.g.), use CSS
for everything else, and still validate as XHTML Transitional.  That's what
XHTML Transitional is all about - moving from the old way to the new.

I'm at work, so I can't dive into your code and see what specifically is
going on, but my initial impression is that you could streamline your CSS by
using some ID's and fewer classes.  This might be a first step in gaining
better control over your positioning.

Will Chatham
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
* 

RE: [WSG] Somewhat frustrated

[theGrafixGuy]

I am far from an expert yet, but your
display issues are very similar to what I got the first time around using CSS –
I discovered IDs rather than classes fro layers provides more precision.

 

Also, you might want to try dropping the
 and running block level text.

 

Brian

 









From: John Penlington
[mailto:[EMAIL PROTECTED] 
Sent: Monday, March 29, 2004 9:08
AM
To: [EMAIL PROTECTED]
Subject: [WSG] Somewhat frustrated



 



Forgive my frustration, but after a couple of months with
this Discussion List I've formed the opinion no browser will display web
standards - every one of them requires hacks of some kind.





 





I test on Win XP Pro with IE6 and Firefox - as well as on a
new eMac with Safari and IE5(Mac).





 





All my earlier web sites with tables rather than CSS 2
display quite well on all four browsers.





 





When I try to code for Web Standards, I get a medley of
results. Hence my opinion that no browser complies completely.





 





Now the crunch: I'm building a site for a photographer who
wants pixel-precision layout on all browsers. At least we achieved
it on IE6 with no tables, just CSS styling.





I'm aware that I shouldn't have done that, but please read
on.





 





After two weeks of frustration trying to get it to work precisely
on the other browsers, I've finally resorted to tables and yes, wicked me, even
a spacer gif.





 





The home page (with inactive links) is at: 





www.bluemountainsgardener.info/hobbs/index.asp





 





and the CSS is at:





www.bluemountainsgardener.info/hobbs/dhpg_style_tables.css





 





The display my client wants is exactly what you'll see with
IE6.





 





What he doesn't want is what you'll see on Safari,
Firefox and IE5(Mac).





 





The page validates for both XHTML 1.0 Transitional and CSS.
Even the Unordered List menu breaks on IE5(Mac).





 





Can anyone tell me why my valid (XHTML and CSS)
page displays so differently in those four browsers - two of which
are supposed to follow Web Standards closely (Firefox and Safari)?





 





Where is my code sub-standard if it validates for both XHTML
and CSS?





 





What do I need to do to get it to display roughly the same
on all four browsers?  Please don't tell me to use CSS 2 - I tried that
and it simply didn't work !! The variations were unacceptable despite all
the hacks I could find.





 





I know I'll be shot down in flames for raising this, but I
really want to code for Web Standards and the frustration for me and my client
is very real !!





 





I'm sure I'm not alone, but I'm keen to persevere.





 





Thanks to you all for such a helpful List.





 





John Penlington





web developer