[WSG] Preventing scrolling
Hi everyone,
I currently have a problem something like this:
div
{
width: 200px;
height: 100%;
overflow: hidden;
}
div
Lots and lots of content which we never expect to fit in the
box
and we just want to be cut off. However, we only want them
to be
able to see what would fit in the box. So, we need to stop
them
from being able to click in the box and use their scroll
wheel.
Another way they could see all the content is by selecting
what
they can see and dragging down.
/div
What's the best way from stopping this from scrolling?
- javascript?
- a nested div which contains the content, positioned with fixed positioning
so even if they scroll the outer div nothing actually changes visually
(would this work? I haven't tested it)
- something else?
Thanks,
Tatham Oddie
Technical Director, Fuel Advance
www.fueladvance.com
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
[WSG] RE: digest for wsg@webstandardsgroup.org
http://www.browsercam.com/ - that really handy site that allow you to preview screenshots of your webpage on all browser/platform combinations.
Re: [WSG] Preventing scrolling
On 21 Jun 2005, at 3:04 pm, Tatham Oddie wrote:
div
{
width: 200px;
height: 100%;
overflow: hidden;
}
height:100% - 100% of what ?
if the parent container has no height declared, the 100% will default
to auto, and all the content will be visible.
what you probably want is setting some height in em/px/km/
then your overflow:hidden will have some effect.
If I'm wrong, please provide a test case (url).
Philippe
---
Philippe Wittenbergh
http://emps.l-c-n.com/
**
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] Preventing scrolling
I used once another div, with the same position and size, a greater
z-index, no content and a background-color set to transparent.
Roberto
-
Tatham Oddie wrote:
Hi everyone,
I currently have a problem something like this:
div
{
width: 200px;
height: 100%;
overflow: hidden;
}
div
Lots and lots of content which we never expect to fit in the
box
and we just want to be cut off. However, we only want them
to be
able to see what would fit in the box. So, we need to stop
them
from being able to click in the box and use their scroll
wheel.
Another way they could see all the content is by selecting
what
they can see and dragging down.
/div
What's the best way from stopping this from scrolling?
- javascript?
- a nested div which contains the content, positioned with fixed positioning
so even if they scroll the outer div nothing actually changes visually
(would this work? I haven't tested it)
- something else?
Thanks,
Tatham Oddie
Technical Director, Fuel Advance
www.fueladvance.com
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
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] Styling forms inside a horizontal navigation bar
I haven't got access to IE/PC right now, but removing the floats and
using display:inline worked for me in FF and Safari.
change these two rules:
#navbar ul {
list-style-type: none;
display:inline;
}
#navbar form {
display:inline;
margin-left: 6px;
}
On 21 Jun 2005, at 5:08 PM, Anura Samara wrote:
I'm trying to get a search form to appear neatly within a horizontal
navigation bar. Here's my test page so far ==
http://www.thesamaras.com/horiz/horiz_form.htm
At the moment, the only way I can get this to work is to float the
form within the containing div. I've noticed that IE and others seem
to handle forms differently - in IE the entire form contents appear to
be slightly higher than in FF and Opera which has the effect of making
the form label appear to be on a different line from the navigation
items.
As a result, I've added a 2px top margin only for IE to push it down a
little.
Firstly, is there a better way to achieve this? All my efforts at
tracking down working examples of this elsewhere have failed!
Secondly, just how do form buttons inherit their font-size? It seems I
can either have large text (ie. the browser default) or much smaller
text.
Thanks for any help, Anura
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
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] Preventing scrolling
Tatham Oddie Lots and lots of content which we never expect to fit in the box and we just want to be cut off. However, we only want them to be able to see what ould fit in the box. So, we need to stop them from being able to click in the box and use their scroll wheel. Another way they could see all the content is by selecting what they can see and dragging down. What's the best way from stopping this from scrolling? Am I the only one that thinks this sort of thing goes directly against tenets of usability and accessibility? I'm not sure about the context, but would it not be possible to implement some word counting / limiting on the server (assuming this is a template for a content management system or similar)? Patrick Patrick H. Lauke Webmaster / University of Salford http://www.salford.ac.uk ** 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] Class Discusion: Centering a Fixed Width Layout
Hi Mario,
That only occurs with IE v5.
IE v5.5, v6, Firefox, Netscape and Opera will all centre the design.
The only amend required to get IE v5 to behave is to add text-align:center to
the body element.
Then compensate for that alignment in the elements below:
* {margin:0; padding:0}
html {height:100%; font-size:100.01%}
body{
text-align:center;
min-height:101%;
font:76.1%/130% Verdana, Helvetica, sans-serif;
color:#000; background:#fff;
width:760px;
margin:0 auto
}
body * {text-align:left}
#wrapper {width:760px}
(Amended from:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#leveller)
IE v5 requires all the centred content to be in a wrapper div (other browsers
don't).
div id=wrapperall centred content in here/div
mike 2k:)2
marqueeblink
e-mail: [EMAIL PROTECTED]
site: http://www.webSemantics.co.uk
/marquee/blink
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
Sent: 20 June 2005 19:32
To: wsg@webstandardsgroup.org
Cc: Mike Foskett
Subject: RE: [WSG] Class Discusion: Centering a Fixed Width Layout
Hi Mike,
Great set of CSS code snippets and explanations! However, there is one
declaration that suggests using margin: 0 auto in the body rule, which
supposedly center-aligns the webpage in the browser. However, testing reveals
that it left-aligns the page, but placing this declaration in a container or
wrapper works.
Please advise...
Respectfully yours,
Mario
You might find this useful to look at:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#leveller
Gives light detail on why certain settings are used.
The latest version:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#levelleru
pdate It requires text-align:center adding for IE v5 though.
Hope it helps
mike 2k:)2
marqueeblink
e-mail: [EMAIL PROTECTED]
site: http://www.webSemantics.co.uk /marquee/blink
**
This email and any files transmitted with it are confidential and
intended solely for the use of the individual or entity to whom they are
addressed. If you have received this email in error please notify the
system manager.
This footnote also confirms that this email message has been swept by
MIMEsweeper for the presence of computer viruses.
www.clearswift.com
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
[WSG] Hiding styles from IE5?
Hello all, I would like to hide the styles of a site from I.E.5, so its pages degrade gracefully (who ever invented this expression had a twisted sense of humor) in this browser… I have a general styles sheet linked to my pages, and I created another styles sheet, just for I.E.5, which I’ve inserted in a conditional expression (if lte IE 5). In this last styles sheet I reset all properties to 0, auto or inherited, using the wildcard selector. Is there any other smarter way of hiding the styles from I.E.5 ? Thanks. Roberto ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Strange font-family behavior on Mac
I have the same strange problem that you can see on this Apple site page: http://guide.apple.com/index.lasso If you look at the left side column with IE (Mac) or Firefox (Mac) the font is different from the one that you can see on Safari, iCab, OmniWeb, Opera, and on all the Windows browsers as well. The font family involved are: Verdana,Geneva,Arial,Helvetica,sans-serif; which are the same of that Apple page, the only difference is that on Apple site the styles are inline styles and the left bar is in a table cell. On my page, instead, the problem arise only in an horizontal navbar (list based), while the rest of the page renders the same font consistently (and correctly) across all the browsers (IE, Firefox and Safari). So only the links on the navbar are affected by this problem. I'm sorry I can't show you the page, but the Apple page I indicated above has the same problem. I have searched on the web about this bug (or behavior), but with no luck. May be a too small font-size issue (10px)? Have somebody had the same problem? And there is a way to fix it (eg: adding another sans-serif font-family that renders better on IE Mac and Firefox Mac when the font-size is about 10px)? TIA Marcello Cerruti ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] HTML-Structure feedback - powerplay.solutionpark.ch
Hello everybody. I'm preparing right now some pages for a new client. I'd be glad to receive some feedback about the code-structure of two of them. The nested divs for the columns are coming from a template builder somewhere on the net, and I'm using them since. Don't know if they are all needed as they are, but they display quite solid so far (as far as I have seen). The general idea is, that the user is able to fold the content of the middle column as he likes, so only the content that is of interest for him/her is shown. This is why the content is inside a definition list. I'm not quite happy with the list below the calendar. Does it make sense to do it this way? html: http://powerplay.solutionpark.ch/test/calendar.html http://powerplay.solutionpark.ch/test/login2.html css: http://powerplay.solutionpark.ch/test/includes/academy.css http://powerplay.solutionpark.ch/test/includes/forms.css Any feedback is welcome. Thanks a lot, Michael Vogt PS: What I still need to do is use relative sizes on some boxes and font, to better support zooming, and the table needs a summary. I also think the contrast of the font is too low. Also, the pages are not completely tested on all browsers yet (I'm working with FireFox), but should be close even on IE on Mac. Correcting these comes next. ** 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] Preventing scrolling
Philippe,
This is within a container which has top:200px;bottom:150px; (or so)...
Thanks,
Tatham Oddie
Technical Director, Fuel Advance
www.fueladvance.com
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
On Behalf Of Philippe Wittenbergh
Sent: Tuesday, 21 June 2005 4:45 PM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] Preventing scrolling
On 21 Jun 2005, at 3:04 pm, Tatham Oddie wrote:
div
{
width: 200px;
height: 100%;
overflow: hidden;
}
height:100% - 100% of what ?
if the parent container has no height declared, the 100% will default
to auto, and all the content will be visible.
what you probably want is setting some height in em/px/km/
then your overflow:hidden will have some effect.
If I'm wrong, please provide a test case (url).
Philippe
---
Philippe Wittenbergh
http://emps.l-c-n.com/
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
[WSG] off topic - wordpress global problems
Hi All Sorry about this off-topic post but I figure there are plenty of people on this list that may be affected. I noticed this morning as I checked the blogs that I read regularly that several are down due to database issues. www.molly.com, photomatt, joe clark, 1976design.com, etc. My blog is wordpress based but is still live. Does anyone know if there is something going around or are they all on the same host? Once again, I apologize for the off-topic post and if you are using wordpress, you may want to check your own blog. Comments can be sent to me off list to [EMAIL PROTECTED] Ted www.tdrake.net (hopefully still active) ** 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] Hiding styles from IE5?
Hi Roberto, On 6/21/05, Roberto Gorjão [EMAIL PROTECTED] wrote: Hello all, I would like to hide the styles of a site from I.E.5, so its pages degrade gracefully (who ever invented this expression had a twisted sense of humor) in this browser… I have a general styles sheet linked to my pages, and I created another styles sheet, just for I.E.5, which I've inserted in a conditional expression (if lte IE 5). In this last styles sheet I reset all properties to 0, auto or inherited, using the wildcard selector. Is there any other smarter way of hiding the styles from I.E.5 ? Thanks. Roberto ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** Maybe this link is useful to you.. http://www.thesitewizard.com/css/excludecss.shtml -- Stefan Lemmen Holland
Re: [WSG] Hiding styles from IE5?
See http://www.dithered.com/css_filters/css_only/ -- Jan Brasna aka JohnyB :: www.alphanumeric.cz | www.janbrasna.com ** 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] Hiding styles from IE5?
Hi Stefan, An interesting article. Thank you. Roberto -- Stefan Lemmen wrote: Hi Roberto, On 6/21/05, Roberto Gorjão [EMAIL PROTECTED] wrote: Hello all, I would like to hide the styles of a site from I.E.5, so its pages degrade gracefully (who ever invented this expression had a twisted sense of humor) in this browser… I have a general styles sheet linked to my pages, and I created another styles sheet, just for I.E.5, which I've inserted in a conditional expression (if lte IE 5). In this last styles sheet I reset all properties to 0, auto or inherited, using the wildcard selector. Is there any other smarter way of hiding the styles from I.E.5 ? Thanks. Roberto ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** Maybe this link is useful to you.. http://www.thesitewizard.com/css/excludecss.shtml ** 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] Class Discusion: Centering a Fixed Width Layout
Good morning Mike,
I must respectfully disagree. I'm looking at my client site in FF, Opera,
Mozilla and Netscape as I compose this reply, and the page is left-aligned
using margin:0 auto in the body rule only.
However, it center-aligns the page when placing the margin:0 auto in a
container div.
body
{text-align: center;
background: #ccc;}
#container
{margin: 0 auto;
width: 760px;
font: normal 12px verdana, arial, sans-serif;
background: #fff;}
Respectfully yours,
Mario
Hi Mario,
That only occurs with IE v5.
IE v5.5, v6, Firefox, Netscape and Opera will all centre the design. The
only amend required to get IE v5 to behave is to add text-align:center
to the body element. Then compensate for that alignment in the elements
below:
* {margin:0; padding:0}
html {height:100%; font-size:100.01%}
body {
text-align:center;
min-height:101%;
font:76.1%/130% Verdana, Helvetica, sans-serif;
color:#000; background:#fff;
width:760px;
margin:0 auto
}
body * {text-align:left}
#wrapper {width:760px}
(Amended from:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#leveller)
IE v5 requires all the centred content to be in a wrapper div (other
browsers don't).
div id=wrapperall centred content in here/div
mike 2k:)2
marqueeblink
e-mail: [EMAIL PROTECTED]
site: http://www.webSemantics.co.uk
/marquee/blink
-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] Sent: 20 June 2005 19:32
To: wsg@webstandardsgroup.org
Cc: Mike Foskett
Subject: RE: [WSG] Class Discusion: Centering a Fixed Width Layout
Hi Mike,
Great set of CSS code snippets and explanations! However, there is one
declaration that suggests using margin: 0 auto in the body rule, which
supposedly center-aligns the webpage in the browser. However, testing
reveals that it left-aligns the page, but placing this declaration in a
container or wrapper works.
Please advise...
Respectfully yours,
Mario
You might find this useful to look at:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#leveller
Gives light detail on why certain settings are used.
The latest version:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#levelleru
pdate It requires text-align:center adding for IE v5 though.
Hope it helps
mike 2k:)2
marqueeblink
e-mail: [EMAIL PROTECTED]
site: http://www.webSemantics.co.uk /marquee/blink
**
This email and any files transmitted with it are confidential and
intended solely for the use of the individual or entity to whom they
are addressed. If you have received this email in error please notify
the system manager.
This footnote also confirms that this email message has been swept by
MIMEsweeper for the presence of computer viruses.
www.clearswift.com
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
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] Class Discusion: Centering a Fixed Width Layout
Hi Mario,
I don't know what's different, but here's the test page I used to develop it:
http://www.websemantics.co.uk/test/centered_content/
Tested as working on:
PC: IE v5, IE v6, Firefox.
Mac: IE v5.2, Safari.
The test example has no margin set on the container div.
Though I don't really think it matters whether it's stated on the body tag or
the container.
I'd put that to personal taste or style.
mike 2k:)2
marqueeblink
e-mail: [EMAIL PROTECTED]
site: http://www.webSemantics.co.uk
/marquee/blink
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
Sent: 21 June 2005 16:11
To: wsg@webstandardsgroup.org
Cc: Mike Foskett
Subject: RE: [WSG] Class Discusion: Centering a Fixed Width Layout
Good morning Mike,
I must respectfully disagree. I'm looking at my client site in FF, Opera,
Mozilla and Netscape as I compose this reply, and the page is left-aligned
using margin:0 auto in the body rule only.
However, it center-aligns the page when placing the margin:0 auto in a
container div.
body
{text-align: center;
background: #ccc;}
#container
{margin: 0 auto;
width: 760px;
font: normal 12px verdana, arial, sans-serif;
background: #fff;}
Respectfully yours,
Mario
Hi Mario,
That only occurs with IE v5.
IE v5.5, v6, Firefox, Netscape and Opera will all centre the design.
The only amend required to get IE v5 to behave is to add
text-align:center to the body element. Then compensate for that
alignment in the elements
below:
* {margin:0; padding:0}
html {height:100%; font-size:100.01%}
body {
text-align:center;
min-height:101%;
font:76.1%/130% Verdana, Helvetica, sans-serif;
color:#000; background:#fff;
width:760px;
margin:0 auto
}
body * {text-align:left}
#wrapper {width:760px}
(Amended from:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#leveller)
IE v5 requires all the centred content to be in a wrapper div (other
browsers don't).
div id=wrapperall centred content in here/div
mike 2k:)2
marqueeblink
e-mail: [EMAIL PROTECTED]
site: http://www.webSemantics.co.uk /marquee/blink
-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] Sent: 20 June 2005 19:32
To: wsg@webstandardsgroup.org
Cc: Mike Foskett
Subject: RE: [WSG] Class Discusion: Centering a Fixed Width Layout
Hi Mike,
Great set of CSS code snippets and explanations! However, there is one
declaration that suggests using margin: 0 auto in the body rule, which
supposedly center-aligns the webpage in the browser. However, testing
reveals that it left-aligns the page, but placing this declaration in a
container or wrapper works.
Please advise...
Respectfully yours,
Mario
You might find this useful to look at:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#leveller
Gives light detail on why certain settings are used.
The latest version:
http://www.websemantics.co.uk/tutorials/useful_css_snippets/#levelleru
pdate It requires text-align:center adding for IE v5 though.
Hope it helps
mike 2k:)2
marqueeblink
e-mail: [EMAIL PROTECTED]
site: http://www.webSemantics.co.uk /marquee/blink
**
This email and any files transmitted with it are confidential and
intended solely for the use of the individual or entity to whom they
are addressed. If you have received this email in error please notify
the system manager.
This footnote also confirms that this email message has been swept by
MIMEsweeper for the presence of computer viruses.
www.clearswift.com
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See
Re: [WSG] Preventing scrolling
Hi Tatham, Width the necessary adaptations, I think this does the trick: div style= position:absolute; left:100px; top:100px; width: 200px; height: 200px; overflow:hidden; border: 1px solid black a href=#Link to the article/a pLots and lots of text. Lots and lots of text./p div style=position:absolute; z-index:2; top:20px; left:0; height:180px; width:200px; background-color:transparent; /div /div The div with the background-color set to transparent inhibits any click over the text or its selection. Another possibility would be to create a behaviour that treats the whole div as a link to the article. Roberto P.S.: I do not know if you received a mail I sent to you outside the list... Some divs have background problems at a resolution of 1400x1050. - Tatham Oddie wrote: Patrick, I'll clarify... basically on whatcanido.com.au we have article teasers - they have to fill a particular area of the screen (and this can change on the fly client side). We don't want the teasers to ever scroll. So, our solution is to have the read full article link at between the heading and the teaser. Then we just have a really long teaser in a div with overflow:hidden. The bigger their window/screen/resolution, the bigger the box, the bigger the teaser. The accessibility side-effect is that they get a really long teaser. We couldn't think of a better way to handle changing resolutions on the site nicely. Any suggestions? Thanks, Tatham Oddie Technical Director, Fuel Advance www.fueladvance.com -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Patrick Lauke Sent: Tuesday, 21 June 2005 6:34 PM To: wsg@webstandardsgroup.org Subject: RE: [WSG] Preventing scrolling Tatham Oddie Lots and lots of content which we never expect to fit in the box and we just want to be cut off. However, we only want them to be able to see what ould fit in the box. So, we need to stop them from being able to click in the box and use their scroll wheel. Another way they could see all the content is by selecting what they can see and dragging down. What's the best way from stopping this from scrolling? Am I the only one that thinks this sort of thing goes directly against tenets of usability and accessibility? I'm not sure about the context, but would it not be possible to implement some word counting / limiting on the server (assuming this is a template for a content management system or similar)? Patrick Patrick H. Lauke Webmaster / University of Salford http://www.salford.ac.uk ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** 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] Hiding styles from IE5?
Thanks Jan, Great link! Roberto --- Jan Brasna wrote: See http://www.dithered.com/css_filters/css_only/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Hi there!
Hi there guys, I'm new :) My name is Erica and I'm a 21 year old graphic design student (only 2 more years to go! Yay!) I have a question though, and it's something that I've really been trying to put a lot of thought into. When building sites using the web standards, the stone-age browsers (Netscape and IE 4 are the two that I'm talking about specifically), are there really enough people out there with browsers that old that we should hack our CSS/etc to make things look okay to them? How exactly would you do that, anyway? If you're not using any design markup in your actual html document, and those browsers can't read CSS - do you make another site specifically for them? Do you create a page that asks for them to upgrade their browser? I can justify going back to IE 5.5, and even IE 5.0 to an extent... but is it really worth our time to go all the way back to the 4.0 browsers? Thanks for your opinions! -Erica Jean
RE: [WSG] Hi there!
There are people using netscape 4. They tend to be stuck in government areas that do not allow people to update their computers or those using old programs that require this browser. It's easy to satisfy their need for content and everyone else's desire for pretty pages. Simply link to a basic css document that defines colors, sizes, etc. Then import your advanced style sheets. NN4 does not recognize the import function. Ted From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Erica Jean Sent: Tuesday, June 21, 2005 11:19 AM To: wsg@webstandardsgroup.org Subject: [WSG] Hi there! Hi there guys, I'm new :) My name is Erica and I'm a 21 year old graphic design student (only 2 more years to go! Yay!) I have a question though, and it's something that I've really been trying to put a lot of thought into. When building sites using the web standards, the stone-age browsers (Netscape and IE 4 are the two that I'm talking about specifically), are there really enough people out there with browsers that old that we should hack our CSS/etc to make things look okay to them? How exactly would you do that, anyway? If you're not using any design markup in your actual html document, and those browsers can't read CSS - do you make another site specifically for them? Do you create a page that asks for them to upgrade their browser? I can justify going back to IE 5.5, and even IE 5.0 to an extent... but is it really worth our time to go all the way back to the 4.0 browsers? Thanks for your opinions! -Erica Jean
RE: [WSG] Hi there!
Ah. Alright. Thank you for the clarification, andthank you forletting me know that Netscape 4 supports stylesheets at all. I didn't realize that there wasany stylesheet support for NS and IE4. Is there somewhere I could download older browsers for testing by chance? ---Original Message--- From: Drake, Ted C. Date: 06/21/05 14:58:00 To: 'wsg@webstandardsgroup.org' Subject: RE: [WSG] Hi there! There are people using netscape 4. They tend to be stuck in government areas that do not allow people to update their computers or those using old programs that require this browser. It's easy to satisfy their need for content and everyone else's desire for pretty pages. Simply link to a basic css document that defines colors, sizes, etc. Then import your advanced style sheets. NN4 does not recognize the import function. Ted From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Erica JeanSent: Tuesday, June 21, 2005 11:19 AMTo: wsg@webstandardsgroup.orgSubject: [WSG] Hi there! Hi there guys, I'm new :) My name is Erica and I'm a 21 year old graphic design student (only 2 more years to go! Yay!) I have a question though, and it's something that I've really been trying to put a lot of thought into. When building sites using the web standards, the stone-age browsers (Netscape and IE 4 are the two that I'm talking about specifically), are there really enough people out there with browsers that old that we should hack our CSS/etc to make things look okay to them? How exactly would you do that, anyway? If you're not using any design markup in your actual html document, and those browsers can't read CSS - do you make another site specifically for them? Do you create a page that asks for them to upgrade their browser? I can justify going back to IE 5.5, and even IE 5.0 to an extent... but is it really worth our time to go all the way back to the 4.0 browsers? Thanks for your opinions! -Erica Jean
Re: [WSG] Hi there!
Hi Erica-- I'm new to the whole Web design thing, but to answer your question, I would say No. Granted that's just my opinion, but the way I see it, time marches on and so does the Web. regards, g. On Tue Jun 21 13:18 , 'Erica Jean' [EMAIL PROTECTED] sent: Hi there guys, I'm new :) My name is Erica and I'm a 21 year old graphic design student (only 2 more years to go! Yay!) I have a question though, and it's something that I've really been trying to put a lot of thought into. When building sites using the web standards, the stone-age browsers (Netscape and IE 4 are the two that I'm talking about specifically), are there really enough people out there with browsers that old that we should hack our CSS/etc to make things look okay to them? How exactly would you do that, anyway? If you're not using any design markup in your actual html document, and those browsers can't read CSS - do you make another site specifically for them? Do you create a page that asks for them to upgrade their browser? I can justify going back to IE 5.5, and even IE 5.0 to an extent... but is it really worth our time to go all the way back to the 4.0 browsers? Thanks for your opinions! -Erica Jean ** 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] Hi there!
http://browsers.evolt.org/ /ironic //posted using Netscape 4 webmail. Ah. Alright. Thank you for the clarification, and thank you for letting me know that Netscape 4 supports stylesheets at all. I didn't realize that there was any stylesheet support for NS and IE 4. Is there somewhere I could download older browsers for testing by chance? ---Original Message--- From: Drake, Ted C. Date: 06/21/05 14:58:00 To: 'wsg@webstandardsgroup.org' Subject: RE: [WSG] Hi there! There are people using netscape 4. They tend to be stuck in government areas that do not allow people to update their computers or those using old programs that require this browser. It's easy to satisfy their need for content and everyone else's desire for pretty pages. Simply link to a basic css document that defines colors, sizes etc. Then import your advanced style sheets. NN4 does not recognize the import function. Ted From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Erica Jean Sent: Tuesday, June 21, 2005 11:19 AM To: wsg@webstandardsgroup.org Subject: [WSG] Hi there! Hi there guys, I'm new :) My name is Erica and I'm a 21 year old graphic design student (only 2 more years to go! Yay!) I have a question though, and it's something that I've really been trying to put a lot of thought into. When building sites using the web standards, the stone-age browsers (Netscape and IE 4 are the two that I'm talking about specifically), are there really enough people out there with browsers that old that we should hack our CSS/etc to make things look okay to them? How exactly would you do that, anyway? If you're not using any design markup in your actual html document, and those browsers can't read CSS - do you make another site specifically for them? Do you create a page that asks for them to upgrade their browser? I can justify going back to IE 5.5, and even IE 5.0 to an extent... but is it really worth our time to go all the way back to the 4.0 browsers? Thanks for your opinions! -Erica Jean ** 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] Hi there!
Erica Jean wrote: Is there somewhere I could download older browsers for testing by chance? http://www.oldversion.com/program.php?n=msie http://wp.netscape.com/download/archive/ ** 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] Hi there!
Thanks to both of you for the links :) I really appreciate it ^^ ---Original Message--- From: Brian Cummiskey Date: 06/21/05 15:31:52 To: wsg@webstandardsgroup.org Subject: Re: [WSG] Hi there! Erica Jean wrote: Is there somewhere I could download older browsers for testing by chance? http://www.oldversion.com/program.php?n=msie http://wp.netscape.com/download/archive/ ** The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Hi there!
Hi, also note that when using XHTML, say with help from Designing with Webstandards from Jeffrey Zeldman, you can make a site that looks great in newer browsers, and also works in older browsers... Maarten Erica Jean wrote: Thanks to both of you for the links :) I really appreciate it ^^ ---Original Message--- From: Brian Cummiskey Date: 06/21/05 15:31:52 To: wsg@webstandardsgroup.org Subject: Re: [WSG] Hi there! Erica Jean wrote: Is there somewhere I could download older browsers for testing by chance? http://www.oldversion.com/program.php?n=msie http://wp.netscape.com/download/archive/ ** The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] accesability and backwards compatibility - WAS [Hi there!]
Hi I am having a similar problem with a site I am developing. I have tried to make it XHTML and CSS compliant. The problem I am having other than minor discrepancies between browsers is that in Safari and IE on OSX 9.0 and maybe even some others, the whole layout goes skew-whiff. Should I even concern myself with this? Its for a design agency who is now saying that this is a requirement; I have said that if they want an accessible site written in CSS they cant have it looking exactly the same in older browsers that dont support CSS 2.0 unless I use old skool presentation techniques. Has anyone else run into this problem? I suspect there are plenty of people, Id be interested to hear what thoughts others had on this subject. Cheers Wayne w: www.freelance-developer.co.ok e: [EMAIL PROTECTED] From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Maarten Stolte Sent: 21 June 2005 20:51 To: wsg@webstandardsgroup.org Subject: Re: [WSG] Hi there! Hi, also note that when using XHTML, say with help from Designing with Webstandards from Jeffrey Zeldman, you can make a site that looks great in newer browsers, and also works in older browsers... Maarten Erica Jean wrote: Thanks to both of you for the links :) I really appreciate it ^^ ---Original Message--- From: Brian Cummiskey Date: 06/21/05 15:31:52 To: wsg@webstandardsgroup.org Subject: Re: [WSG] Hi there! Erica Jean wrote: Is there somewhere I could download older browsers for testing by chance? http://www.oldversion.com/program.php?n=msie http://wp.netscape.com/download/archive/ ** The discussion list forhttp://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: Re: [WSG] Hi there!
I would check your web logs to answer this question. Using a program such as Web Trends to generate reports, you can then tell where your traffic is coming from and what your web site visitors are using browser wise. Jeff From: [EMAIL PROTECTED] Date: 2005/06/21 Tue PM 03:07:41 EDT To: wsg@webstandardsgroup.org Subject: Re: [WSG] Hi there! Thanks! Jeff http://www.patandjeff.com * * Visit http://www.websites4199.com for an alternative to high development prices! Visit http://www.milliondollarsites.net if you just got to spend the big bucks and brag about it. Hi Erica-- I'm new to the whole Web design thing, but to answer your question, I would say No. Granted that's just my opinion, but the way I see it, time marches on and so does the Web. regards, g. On Tue Jun 21 13:18 , 'Erica Jean' [EMAIL PROTECTED] sent: Hi there guys, I'm new :) My name is Erica and I'm a 21 year old graphic design student (only 2 more years to go! Yay!) I have a question though, and it's something that I've really been trying to put a lot of thought into. When building sites using the web standards, the stone-age browsers (Netscape and IE 4 are the two that I'm talking about specifically), are there really enough people out there with browsers that old that we should hack our CSS/etc to make things look okay to them? How exactly would you do that, anyway? If you're not using any design markup in your actual html document, and those browsers can't read CSS - do you make another site specifically for them? Do you create a page that asks for them to upgrade their browser? I can justify going back to IE 5.5, and even IE 5.0 to an extent... but is it really worth our time to go all the way back to the 4.0 browsers? Thanks for your opinions! -Erica Jean ** 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] accesability and backwards compatibility - WAS [Hi there!]
wayne wrote: It’s for a design agency who is now saying that this is a requirement; And that's the crux of the argument: if the project documentation clearly states that the site must work and look same/similar even in older browsers, then that's what you've got to deliver. I always make a point of clarifying exactly, even before taking on a job, what minimum spec I'm developing for. Based on that, you make your choice: a) IE5+, Netscape6+, etc: CSS driven layout, minimal styles fed to older browsers; site is still usable and accessible in old user agents, just not pretty; b) must support Netscape4.x (even in terms of look and feel): clean table based holder, most of the rest still done via CSS; I have said that if they want an accessible site written in CSS they can’t have it looking exactly the same in older browsers that don’t support CSS 2.0 unless I use ‘old skool’ presentation techniques. Keep in mind that even in the days before this whole CSS-driven layout renaissance, it was possible to create fairly accessible sites. Table-based layout does not necessarily mean that accessibility has to take a back seat. Sure, you *should* use CSS, and only *should* use tables for tabular data, but if you don't, then WCAG 1.0 still has a few tips and then sends you on your merry way. Has anyone else run into this problem? I suspect there are plenty of people, I’d be interested to hear what thoughts others had on this subject. As I mentioned above, it comes down to clearly stating client/agency expectations. The project documentation needs to be crystal clear about what platforms/browsers the site needs to work under, and on which it has to also LOOK good. Whether you then choose to go for CSS-driven or table-based is strongly influenced by these factors. And even layout tables can be accessible, if used wisely and sparingly. -- Patrick H. Lauke _ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com ** 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] accesability and backwards compatibility - WAS [Hi ther e!]
Hi Patrick Thanks for a thoughtful reply. It's easy to get lost in the arguments of whether or not to support an outdated browser and forget that sometimes our obligations are more personal. It's important to remember what you promised the client. Ted -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Patrick H. Lauke Sent: Tuesday, June 21, 2005 1:38 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] accesability and backwards compatibility - WAS [Hi there!] wayne wrote: It's for a design agency who is now saying that this is a requirement; And that's the crux of the argument: if the project documentation clearly states that the site must work and look same/similar even in older browsers, then that's what you've got to deliver. I always make a point of clarifying exactly, even before taking on a job, what minimum spec I'm developing for. Based on that, you make your choice: a) IE5+, Netscape6+, etc: CSS driven layout, minimal styles fed to older browsers; site is still usable and accessible in old user agents, just not pretty; b) must support Netscape4.x (even in terms of look and feel): clean table based holder, most of the rest still done via CSS; I have said that if they want an accessible site written in CSS they can't have it looking exactly the same in older browsers that don't support CSS 2.0 unless I use 'old skool' presentation techniques. Keep in mind that even in the days before this whole CSS-driven layout renaissance, it was possible to create fairly accessible sites. Table-based layout does not necessarily mean that accessibility has to take a back seat. Sure, you *should* use CSS, and only *should* use tables for tabular data, but if you don't, then WCAG 1.0 still has a few tips and then sends you on your merry way. Has anyone else run into this problem? I suspect there are plenty of people, I'd be interested to hear what thoughts others had on this subject. As I mentioned above, it comes down to clearly stating client/agency expectations. The project documentation needs to be crystal clear about what platforms/browsers the site needs to work under, and on which it has to also LOOK good. Whether you then choose to go for CSS-driven or table-based is strongly influenced by these factors. And even layout tables can be accessible, if used wisely and sparingly. -- Patrick H. Lauke _ re*dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** 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] Strange font-family behavior on Mac
Marcello Cerruti wrote: I have the same strange problem that you can see on this Apple site page: http://guide.apple.com/index.lasso If you look at the left side column with IE (Mac) or Firefox (Mac) the font is different from the one that you can see on Safari, iCab, OmniWeb, Opera, and on all the Windows browsers as well. Not having a Mac, I can't test this, but: could it not just be the fact that (stab in the dark) Safari and co use a better font smoothing algorithm than FF and IE? -- Patrick H. Lauke _ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com ** 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] accesability and backwards compatibility - WAS [Hi ther e!]
Hi Patrick Thanks for such an insightful reply. I have looked at the spec and as I thought, we agreed on IE (5.5/6.0) and FF on Mac and Windows. I guess I am going to have to write an email explaining my position. Cheers W -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Drake, Ted C. Sent: 21 June 2005 21:48 To: 'wsg@webstandardsgroup.org' Subject: RE: [WSG] accesability and backwards compatibility - WAS [Hi ther e!] Hi Patrick Thanks for a thoughtful reply. It's easy to get lost in the arguments of whether or not to support an outdated browser and forget that sometimes our obligations are more personal. It's important to remember what you promised the client. Ted -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Patrick H. Lauke Sent: Tuesday, June 21, 2005 1:38 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] accesability and backwards compatibility - WAS [Hi there!] wayne wrote: It's for a design agency who is now saying that this is a requirement; And that's the crux of the argument: if the project documentation clearly states that the site must work and look same/similar even in older browsers, then that's what you've got to deliver. I always make a point of clarifying exactly, even before taking on a job, what minimum spec I'm developing for. Based on that, you make your choice: a) IE5+, Netscape6+, etc: CSS driven layout, minimal styles fed to older browsers; site is still usable and accessible in old user agents, just not pretty; b) must support Netscape4.x (even in terms of look and feel): clean table based holder, most of the rest still done via CSS; I have said that if they want an accessible site written in CSS they can't have it looking exactly the same in older browsers that don't support CSS 2.0 unless I use 'old skool' presentation techniques. Keep in mind that even in the days before this whole CSS-driven layout renaissance, it was possible to create fairly accessible sites. Table-based layout does not necessarily mean that accessibility has to take a back seat. Sure, you *should* use CSS, and only *should* use tables for tabular data, but if you don't, then WCAG 1.0 still has a few tips and then sends you on your merry way. Has anyone else run into this problem? I suspect there are plenty of people, I'd be interested to hear what thoughts others had on this subject. As I mentioned above, it comes down to clearly stating client/agency expectations. The project documentation needs to be crystal clear about what platforms/browsers the site needs to work under, and on which it has to also LOOK good. Whether you then choose to go for CSS-driven or table-based is strongly influenced by these factors. And even layout tables can be accessible, if used wisely and sparingly. -- Patrick H. Lauke _ re*dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Reminder: Auckland Geeks
Just a reminder to all the Aucklanders in da house - tonight is the informal WSG get together at the The Belgian Beer Café in Takapuna ( 136 Hurstmere Road) from around 7pm. Looking forward to meeting some other local web standards geeks! Yay. Darren ** 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] Strange font-family behavior on Mac
On 21 Jun 2005, at 9:43 PM, Marcello Cerruti wrote:
I have the same strange problem that you can see on this Apple site
page:
http://guide.apple.com/index.lasso
If you look at the left side column with IE (Mac) or Firefox (Mac) the
font is different from the one that you can see on Safari, iCab,
OmniWeb, Opera, and on all the Windows browsers as well.
The font family involved are:
Verdana,Geneva,Arial,Helvetica,sans-serif;
which are the same of that Apple page, the only difference is that on
Apple site the styles are inline styles and the left bar is in a table
cell.
For starters, the Apple site uses style=font: 10px Geneva, Verdana,
Arial, Helvetica, sans-serif;. Are you sure your font-family is not
different - Verdana as the primary font, not Geneva?
Apart from that, the only difference I can see between Safari and
IE5/Mac is that the 10px font in the LH list of links is anti-aliased
('smoothed') in Safari, but not in Explorer. Safari takes advantage of
OS X's rendering engine to provide smooth fonts; IE is old enough that
it doesn't.
The minimum size font that is smoothed by apps that can do so is set
via System Prefs Appearance 'Turn off text smpoothing for font
sizes [...] and smaller'. From memory, the default setting is 10px; I
have mine set to 8px, so check this setting, also.
Just another example of how sites render differently acros different
browsers.
N
___
Omnivision. Websight.
http://www.omnivision.com.au/
**
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] Strange font-family behavior on Mac
On 22/6/05 6:52 AM, Patrick H. Lauke [EMAIL PROTECTED] wrote: Marcello Cerruti wrote: I have the same strange problem that you can see on this Apple site page: http://guide.apple.com/index.lasso If you look at the left side column with IE (Mac) or Firefox (Mac) the font is different from the one that you can see on Safari, iCab, OmniWeb, Opera, and on all the Windows browsers as well. Not having a Mac, I can't test this, but: could it not just be the fact that (stab in the dark) Safari and co use a better font smoothing algorithm than FF and IE? As far as I'm aware font smoothing is handled by the OS in OS X, and apps are hands-off in this regard. K -- Kevin Futter Webmaster, St. Bernard's College http://www.sbc.melb.catholic.edu.au/ ** 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] Strange font-family behavior on Mac
Kevin Futter wrote: As far as I'm aware font smoothing is handled by the OS in OS X, and apps are hands-off in this regard. Apps still need to be coded specifically to take tap straight into OS X's improved Quartz rendering, as far as I know. -- Patrick H. Lauke _ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] Proper use of nbsp;
I tend to use nbsp; alot when it comes to seperating horizontal menu items with a pike "|". while this gives me what I want visually,I've always been sort of intuitively uncomfortable with this technique for some reason. Here's what I tend to do: ul id="topNav"lia href="" title="James Danielikrsquo;s latest works." accesskey="1"Latest Works/anbsp;|nbsp;/lilia href="" title="Download a chapter from The Raven and The Hawk." accesskey="2"Read A Chapter/anbsp;|nbsp;/lilia href="" title="Where to buy The Raven and The Hawk." accesskey="3"Buy The Book/a/li/ul Is there a better (best practices) way to do this? The only way I can thinkof accomplishing the same effectis by surrounding the "|" with a span class which would pad-out the left and right sides of the pike, like this: span class="padPike"|/span. But if I take that approach, that would be alot of spans within my nav items. Interested in anyone weighing in on this topic. Cole
[WSG] font-size =1em (in the body) vs. font-size = 101%
I've just gotten comfortable using ems for font sizing in my projects by starting out with font-size=1em within the body tag. Now I'm seeing that some people are using font-size = 101% in the body tag. I seem to remember someone saying that using "1em" in the body tag makes some versions of IE flinch - which of course I'd rather avoid. So, what's the deal? is it better/safer to user 101% vs 1em to set the initial font sizing for maximum cross browser compatiblility, or is this just a matter of style and preference? Cole
Re: [WSG] Proper use of nbsp;
I have the same dilemma and always feel uncomfortable about it. Yesterday I accidentally 'discover' that by adding few pixel of padding in the .li or .li a does the trick. tee I tend to use nbsp; alot when it comes to seperating horizontal menu items with a pike |. while this gives me what I want visually, I've always been sort of intuitively uncomfortable with this technique for some reason. Here's what I tend to do: ul id=topNav lia href=/latest/ title=James Danielikrsquo;s latest works. accesskey=1Latest Works/anbsp;|nbsp;/li lia href=read/ title=Download a chapter from The Raven and The Hawk. accesskey=2Read A Chapter/anbsp;|nbsp;/li lia href=/buy/ title=Where to buy The Raven and The Hawk. accesskey=3Buy The Book/a/li /ul Is there a better (best practices) way to do this? The only way I can think of accomplishing the same effect is by surrounding the | with a span class which would pad-out the left and right sides of the pike, like this: span class=padPike|/span. But if I take that approach, that would be alot of spans within my nav items. Interested in anyone weighing in on this topic. Cole ** 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] Proper use of nbsp;
Cole Kuryakin - x7m wrote: Here's what I tend to do: ul id=topNav lia href=/latest/ title=James Danielikrsquo;s latest works. accesskey=1Latest Works/anbsp;|nbsp;/li lia href=read/ title=Download a chapter from The Raven and The Hawk. accesskey=2Read A Chapter/anbsp;|nbsp;/li lia href=/buy/ title=Where to buy The Raven and The Hawk. accesskey=3Buy The Book/a/li /ul Is there a better (best practices) way to do this? Don't use any extra characters like nbsp; and | but simply assign a right-hand border to the list item and an additional class on the last one to suppress it - or the opposite (left-hand border, with a class on the first one). You can now control padding and margin to suit your needs. -- Patrick H. Lauke _ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com ** 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] Proper use of nbsp;
Cole Kuryakin - x7m wrote: I tend to use nbsp; alot when it comes to seperating horizontal menu items with a pike |. while this gives me what I want visually, I've always been sort of intuitively uncomfortable with this technique for some reason. Here's what I tend to do: ul id=topNav lia href=/latest/ title=James Danielikrsquo;s latest works. accesskey=1Latest Works/anbsp;|nbsp;/li lia href=read/ title=Download a chapter from The Raven and The Hawk. accesskey=2Read A Chapter/anbsp;|nbsp;/li lia href=/buy/ title=Where to buy The Raven and The Hawk. accesskey=3Buy The Book/a/li /ul Is there a better (best practices) way to do this? The only way I can think of accomplishing the same effect is by surrounding the | with a span class which would pad-out the left and right sides of the pike, like this: span class=padPike|/span. But if I take that approach, that would be alot of spans within my nav items. Interested in anyone weighing in on this topic. Cole you could put a right margin on the anchor tag and a right padding on the li tag? Glenn ** 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] font-size =1em (in the body) vs. font-size = 101%
personally I always use the default font sized provided by css...if I
need it bigger then I use em values. here's an example:
body {
font: small Arial, sans-serif;
}
p { 1em; }
h1 {2em; }
h2 {1.8em; }
etc...
That way you know that the font will _always_ be readable. Even if
you start off with xx-small you know that every browser will (read
should) render it at a readable size. Avoid scaling fonts sizes
down...always scale them up.
HTH
D
www.dontcom.com
On 6/22/05, Cole Kuryakin - x7m [EMAIL PROTECTED] wrote:
I've just gotten comfortable using ems for font sizing in my projects by
starting out with font-size=1em within the body tag. Now I'm seeing that
some people are using font-size = 101% in the body tag. I seem to remember
someone saying that using 1em in the body tag makes some versions of IE
flinch - which of course I'd rather avoid.
So, what's the deal? is it better/safer to user 101% vs 1em to set the
initial font sizing for maximum cross browser compatiblility, or is this
just a matter of style and preference?
Cole
**
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] Proper use of nbsp;
-Original Message- From: Patrick H. Lauke [mailto:[EMAIL PROTECTED] Sent: Wednesday, 22 June 2005 11:26 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Proper use of nbsp; Cole Kuryakin - x7m wrote: Here's what I tend to do: ul id=topNav lia href=/latest/ title=James Danielikrsquo;s latest works. accesskey=1Latest Works/anbsp;|nbsp;/li lia href=read/ title=Download a chapter from The Raven and The Hawk. accesskey=2Read A Chapter/anbsp;|nbsp;/li lia href=/buy/ title=Where to buy The Raven and The Hawk. accesskey=3Buy The Book/a/li /ul Is there a better (best practices) way to do this? --- I also agree not to use nbsp; | nbsp; but find it much easier to control look and feel if you make a small image of the divider (this is very minimal size and reused across a whole site) and apply this bg image to the li as a background image on the left... then to get rid of the first one you just need to create a first class that cancels out the first bg image. This way you have total control over the look and spacing of the divider (way more than the text method AND the border method) and when styles are turned off it looks like a normal list without the text | symbol hanging about! scott gledhill ** 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] font-size =1em (in the body) vs. font-size = 101%
Cole Kuryakin - x7m wrote: So, what's the deal? is it better/safer to user 101% vs 1em to set the initial font sizing for maximum cross browser compatiblility, or is this just a matter of style and preference? Two things: * IE has a problem resizing font sizes properly if the topmost size is set in ems, but has no trouble with percentages. Setting the body in % (or even the HTML element itself) will fix this problem. You can set your base size to 100%, and then safely use ems for anything below that; * from what I remember, Opera has some rounding problems when calculating font sizes that make it display text just a shade smaller than other browsers; this is the reason for the additional 1 percent, resulting in 101% (I think even 100.1% would do the trick, not sure...I don't normally bother with this infinitesimal difference, to be honest) -- Patrick H. Lauke _ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com ** 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] Proper use of nbsp;
Gledhill, Scott wrote: I also agree not to use nbsp; | nbsp; but find it much easier to control look and feel if you make a small image of the divider Yup, also a valid method of course. One thing to keep in mind: using an image won't resize the divider if the font size is changed, while a border will take its cue from its element's height. This way you have total control over the look and spacing of the divider (way more than the text method AND the border method) and when styles are turned off it looks like a normal list without the text | symbol hanging about! ...and screenreader users, for instance, won't hear stuff like item: latest works *vertical bar* -- Patrick H. Lauke _ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] weird behaviour in opera and IE...sometimes
Kia Ora, I've just relaunched my website and it was all going quite well until i tried to look at it in Opera (8.0.2). it displays the home page perfectly, but the moment I click on any link it tries to download the page as application/octec-stream...what the?! Does this have something to do with XHTML and parsing it as text/html? So confused. The site is here: www.dontcom.com This may be off-topic so please send replies to me off-list and I'll recap the findings once its sorted. Thanks in advance Darren ** 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] Strange font-family behavior on Mac
On 22 Jun 2005, at 8:58 am, Patrick H. Lauke wrote: Apps still need to be coded specifically to take tap straight into OS X's improved Quartz rendering, as far as I know. IE Mac 5.23 was a release to update the hooks to use the OS level rendering/smoothing. It doesn't do as good a job as Safari/Omniweb/Opera/Firefox, but the difference is hard to notice, except (maybe) at smaller font-sizes (10px or less), or when the browser has to do some interpolation on the fly to (like bolding out the font, when no bold glyphs are available). In the latest case, IE Mac has some problems compared to Safari. It is also possible that IE calls the OS 9 version of Geneva, if Classic is installed on that machine. I never investigated that in IE - old Mozilla browsers (1.0-1.3) used to do that as well. That can affect the font-smoothing. That said, all browsers on my Powerbook use the same font in the URL mentioned by the OP, namely Geneva, as specified by the inline styles. Because of me setting a minimum font size in some browsers (Opera, Firefox, Safari, those that I actually use), the text looks slightly bigger there. And in the case of Verdana, it can look very different at smallsmall font-sizes like 10px or less, as far as I remember. I don't have that font installed on my machines anymore. (eg: adding another sans-serif font-family that renders better on IE Mac and Firefox Mac when the font-size is about 10px)? Geneva renders fairly well, although I never see it at 10px (minimum font-size set). 'Lucida Grande' is a very good font for use on OS X. Its equivalent is Lucida Sans Unicode on Win 2k or XP http://dev.l-c-n.com/font_test/font3.html --- BTW - if someone could send me a screenshot (png) of the above test box on XP, it would be nice. (with smooth type on/off). Thanks in advance. Philippe --- Philippe Wittenbergh http://emps.l-c-n.com/ ** 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] accesability and backwards compatibility - WAS [Hi there!]
requirement; I have said that if they want an accessible site written in CSS they can't have it looking exactly the same in older browsers that don't support CSS 2.0 unless I use 'old skool' presentation techniques. Has anyone else run into this problem? I suspect there are plenty of people, I'd be interested to hear what thoughts others had on this subject. I use a wording trick when dealing with this issue: I say very old browsers are supported via graceful degradation. Supported is a positive word and doesn't imply that the site will break in old browsers. The other thing is to get some idea of browser usage in your target market. If your site - for whatever reason - has a huge proportion of users with an old browser, it will be worth putting more effort into a nicer degradation for that browser. But I would sacrifice future-robust design for the sake of supporting old and busted browsers. Roads are not optimised for horse and cart, after all. h -- --- http://www.200ok.com.au/ --- The future has arrived; it's just not --- evenly distributed. - William Gibson ** 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] weird behaviour in opera and IE...sometimes
Hi again,
Live Headers came to the rescue. Turns out my wordpress install
wasn't setting the get_option('html_type') var. So when wordpress
was building the header information is was passing NULL as the mime
typenot optimum.
I just hard coded my desired content type in wp-blog-header.php
EOT
D
On 6/22/05, Darren Wood [EMAIL PROTECTED] wrote:
Kia Ora,
I've just relaunched my website and it was all going quite well until
i tried to look at it in Opera (8.0.2). it displays the home page
perfectly, but the moment I click on any link it tries to download the
page as application/octec-stream...what the?! Does this have
something to do with XHTML and parsing it as text/html? So confused.
The site is here:
www.dontcom.com
This may be off-topic so please send replies to me off-list and I'll
recap the findings once its sorted.
Thanks in advance
Darren
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
[WSG] detecting css display properties
I have been trying to detect ,using javascript , the css display property (set via an external @import style sheet) of an element Example page: http://www.jimthatcher.com/site_resources.htm has a LI (class=skip with CSS display:none. but when i try to find this via the (IE DOM) i cannot locate it. any ideas? with regards Steven Faulkner Web Accessibility Consultant National Information Library Service (NILS) 454 Glenferrie Road Kooyong Victoria 3144 Phone: (613) 9864 9281 Fax: (613) 9864 9210 Email: [EMAIL PROTECTED] National Information Library Service A subsidiary of RBS.RVIB.VAF Ltd. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
