E-mail List Archives

Search E-mail List Archives for

Number of posts in this thread: 5 (In chronological order)

From: HAA
Date: Thu, May 26 2005 8:37AM
Subject: CSS files unpredictable
No previous message | Next message →

I am having problems with the formatting display produced by css files.

One moment it is working and showing the layout I want, then the next
moment they have 'bunched up' the layout. Why? Is it just my computer? I've
tried the same file in IE5, Firefox, Opera. and Netscape 7, and it is
exactly the same faulty display...

I know that if I open the file tomorrow it will be fine! What is worrying
me is if the display is unpredictible on my pc, will it be unstable online too?

I'm putting the pages I have converted online at
www.newchaletclub.co.uk/TESTZONE/alternate in case anyone cares to have a
look, but only the following stumps are css-ed: [ Club Information ], [
Elinor Brent-Dyer ], [ Guest book and Games ] and [ Publications ]. The
rest is still tables. The css format is replicating the visual format of
the tables, or it should be!
Helen.

From: Terence de Giere
Date: Thu, May 26 2005 7:34PM
Subject: Re: CSS files unpredictable
← Previous message | Next message →

HAA < = EMAIL ADDRESS REMOVED = > wrote:
I am having problems with the formatting display produced by css files...

The URL you provided
www.newchaletclub.co.uk/TESTZONE/alternate is in a restricted directory
- we can't look at it.
Error message: 403 Forbidden; You don't have permission to access
/TESTZONE/alternate/ on this server.

CSS will bunch up, especially with reflowing designs, particularly if
you use floats to wrap text around pictures or other elements. You may
need to apply clear:left or clear:right or clear:both properties to
elements that you do not want to wrap around floated elements. Also, for
example, if a page is very narrow, text can overlap other elements. This
can be handled in various ways by using the overflow property. There is
a limit to how much you can change the window size and still have a
readable page, depending on the design. CSS does not always completely
constrain the content of an element within a given space like a table
cell does. You have to get used to that behavior and design around it.
With most computer monitors at 800x600 or larger, a page should look
good at this size and larger, but still be readable at 640x480. Although
CSS cannot exactly replicate what one can do with tables, it is really
more powerful overall. You can also provide alternate stylesheets, for
those devices and browsers that support them, for example, a one-column
design that works well for greatly enlarging fonts or for a small device
like a PDA.

Terence de Giere
= EMAIL ADDRESS REMOVED =

From: HAA
Date: Fri, May 27 2005 2:03AM
Subject: Re: CSS files unpredictable
← Previous message | Next message →

Try this one: http://www.newchaletclub.co.uk/0/index.htm (it worked for me
just now).

I've not nested most of my layout <div>s, at this point I get more confused
with working out which </div> is connected to which <div> so essentially
the site is one column anyway. I use 800x600 anyway (on a 19 inch monitor
but it wont let me size down to 640x480) and one of *my* personal peeves is
when I find a site that was designed for a minimum of 1024x768! I hate
having to scroll left, so I try to avoid doing that on my sites, with
varying sucess I suspect.

At 02:35 27/05/2005, you wrote:

>HAA < = EMAIL ADDRESS REMOVED = > wrote:
>I am having problems with the formatting display produced by css files...
>
>The URL you provided
>www.newchaletclub.co.uk/TESTZONE/alternate is in a restricted directory -
>we can't look at it.
>Error message: 403 Forbidden; You don't have permission to access
>/TESTZONE/alternate/ on this server.
>
>CSS will bunch up, especially with reflowing designs, particularly if you
>use floats to wrap text around pictures or other elements. You may need to
>apply clear:left or clear:right or clear:both properties to elements that
>you do not want to wrap around floated elements. Also, for example, if a
>page is very narrow, text can overlap other elements. This can be handled
>in various ways by using the overflow property. There is a limit to how
>much you can change the window size and still have a readable page,
>depending on the design. CSS does not always completely constrain the
>content of an element within a given space like a table cell does. You
>have to get used to that behavior and design around it. With most computer
>monitors at 800x600 or larger, a page should look good at this size and
>larger, but still be readable at 640x480. Although CSS cannot exactly
>replicate what one can do with tables, it is really more powerful overall.
>You can also provide alternate stylesheets, for those devices and browsers
>that support them, for example, a one-column design that works well for
>greatly enlarging fonts or for a small device like a PDA.
>
>Terence de Giere
> = EMAIL ADDRESS REMOVED =
>
>
>_______________________________________________
>To manage your subscription, visit http://list.webaim.org/
>Address list messages to = EMAIL ADDRESS REMOVED =

From: Michael Moore
Date: Sat, May 28 2005 9:56AM
Subject: Re: CSS files unpredictable
← Previous message | Next message →

A few comments and suggestions please see below.

The site is built using a transitional dtd rather than strict. Use a
strict dtd and validate you site using an automated tool such as the
W3Cs validator found at http://validator.w3.org/ When I tested your
page using its current dtd on the W3C validator it failed. Moving to a
strict dtd and correcting all of the validation errors will go a long
way toward correcting your issues with cross browser compatibility and
css consistency.

Validate your CSS, the CSS for the page also fails the W3C validator.
http://jigsaw.w3.org/css-validator/ This should help clean up most of
the remaining CSS issues that you are experiencing.

Avoid the use of deprecated elements - use of a strict dtd will help you
here as well. You can usually (border within the img tag was spotted
by Cynthia-says).

Don't design for a specific screen size or resolution. It is impossible
to anticipate all of the possible combinations and devices that are out
there or will be out there. For instance, my laptops default resolution
is 1600X1200 on a 15.5in display, my home desktop has a 19 in display
set to 1280X1024, my secondary monitor at work is 17in and gets set to a
wide variety of resolutions depending upon my testing mode, and my cell
phone has a 2in display with what I think may be a 400X400px resolution
and a browser that I have set not to download any images.

So what the heck does all or any of this have to to with the topic of
this list, accessibility. The use of valid mark up helps ensure that
your site will work with the widest array of presentation technologies
possible. These technologies whether they are browsers, screen readers,
bots or whatever may be created in the future are designed by their
manufacturers using these dtds when we conform to these dtds we give
them the best chance of working as desired.

Moving on to the subject of not designing to a specific screen
resolution or size. The use of elastic and fluid design enhances
accessibility by allowing documents to scale and to flow to fill the
available space. The benefits of fluid design are controversial because
of concerns regarding the width of text columns and their relationship
to readability and eyestrain. IMHO these arguments are not particularly
valid in light of my discussion of screen size and resolution
possibilities above. If the text column is uncomfortably wide user can
scale his or her browser window. Friends of mine who are lucky enough
to have very large monitors (21in and above) seldom use their browsers
with the window maximized.

But wait, should we depend upon users knowing that they can scale their
browser windows to make our pages more accessible or usable? Well, we
use good structured, semantic markup to benefit screen reader users and
other user agents that can take advantage of the documents structure to
improve navigation. We use link text that makes sense out of context to
allow users who are knowledgeable to take advantage of link lists. IMHO
window scaling is a basic computer survival skill and is known to all
but a few of the most novice users who will quickly learn this feature.

To learn more google the following topics:

Web Standards
Universal Design
Liquid Design
Elastic Design


Mike


HAA wrote:
> Try this one: http://www.newchaletclub.co.uk/0/index.htm (it worked for
> me just now).
>
> I've not nested most of my layout <div>s, at this point I get more
> confused with working out which </div> is connected to which <div> so
> essentially the site is one column anyway. I use 800x600 anyway (on a 19
> inch monitor but it wont let me size down to 640x480) and one of *my*
> personal peeves is when I find a site that was designed for a minimum
> of 1024x768! I hate having to scroll left, so I try to avoid doing that
> on my sites, with varying sucess I suspect.
>

From: HAA
Date: Sat, May 28 2005 11:05AM
Subject: Re: CSS files unpredictable
← Previous message | No next message

Thanks - will investigate and follow through............ Appreciate the
comments as I'm a novice at complex css layouts.

Helen

At 16:57 28/05/2005, you wrote:

>A few comments and suggestions please see below.
>
>The site is built using a transitional dtd rather than strict. Use a
>strict dtd and validate you site using an automated tool such as the W3Cs
>validator found at http://validator.w3.org/ When I tested your page
>using its current dtd on the W3C validator it failed. Moving to a strict
>dtd and correcting all of the validation errors will go a long way toward
>correcting your issues with cross browser compatibility and css consistency.
>
>Validate your CSS, the CSS for the page also fails the W3C validator.
>http://jigsaw.w3.org/css-validator/ This should help clean up most of the
>remaining CSS issues that you are experiencing.
>
>Avoid the use of deprecated elements - use of a strict dtd will help you
>here as well. You can usually (border within the img tag was spotted by
>Cynthia-says).
>
>Don't design for a specific screen size or resolution. It is impossible
>to anticipate all of the possible combinations and devices that are out
>there or will be out there. For instance, my laptops default resolution
>is 1600X1200 on a 15.5in display, my home desktop has a 19 in display set
>to 1280X1024, my secondary monitor at work is 17in and gets set to a wide
>variety of resolutions depending upon my testing mode, and my cell phone
>has a 2in display with what I think may be a 400X400px resolution and a
>browser that I have set not to download any images.
>
>So what the heck does all or any of this have to to with the topic of this
>list, accessibility. The use of valid mark up helps ensure that your site
>will work with the widest array of presentation technologies
>possible. These technologies whether they are browsers, screen readers,
>bots or whatever may be created in the future are designed by their
>manufacturers using these dtds when we conform to these dtds we give them
>the best chance of working as desired.
>
>Moving on to the subject of not designing to a specific screen resolution
>or size. The use of elastic and fluid design enhances accessibility by
>allowing documents to scale and to flow to fill the available space. The
>benefits of fluid design are controversial because of concerns regarding
>the width of text columns and their relationship to readability and
>eyestrain. IMHO these arguments are not particularly valid in light of my
>discussion of screen size and resolution possibilities above. If the text
>column is uncomfortably wide user can scale his or her browser
>window. Friends of mine who are lucky enough to have very large monitors
>(21in and above) seldom use their browsers with the window maximized.
>
>But wait, should we depend upon users knowing that they can scale their
>browser windows to make our pages more accessible or usable? Well, we use
>good structured, semantic markup to benefit screen reader users and other
>user agents that can take advantage of the documents structure to improve
>navigation. We use link text that makes sense out of context to allow
>users who are knowledgeable to take advantage of link lists. IMHO window
>scaling is a basic computer survival skill and is known to all but a few
>of the most novice users who will quickly learn this feature.
>
>To learn more google the following topics:
>
>Web Standards
>Universal Design
>Liquid Design
>Elastic Design
>
>
>Mike
>
>
>HAA wrote:
>>Try this one: http://www.newchaletclub.co.uk/0/index.htm (it worked for
>>me just now).
>>I've not nested most of my layout <div>s, at this point I get more
>>confused with working out which </div> is connected to which <div> so
>>essentially the site is one column anyway. I use 800x600 anyway (on a 19
>>inch monitor but it wont let me size down to 640x480) and one of *my*
>>personal peeves is when I find a site that was designed for a minimum of
>>1024x768! I hate having to scroll left, so I try to avoid doing that on
>>my sites, with varying sucess I suspect.
>_______________________________________________
>To manage your subscription, visit http://list.webaim.org/
>Address list messages to = EMAIL ADDRESS REMOVED =