[WSG] CSS Expandable Menu

2010-06-28 Thread grant_malcolm_bailey

Hello,

I would be grateful if someone could clarify whether there is such a thing as a 
pure CSS expandable menu. The sort of thing I'm looking for is the expandable / 
collapsible hierachy commonly shown in the left-hand frame of Windows programs 
such as Explorer or Outlook.

I'm trying to avoid use of Javascript due to accessibility concerns.

Thank you and regards,

Grant Bailey

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS Expandable Menu

2010-06-28 Thread Jelina Korhecz
Hi Grant,

I'm not sure if this is what you're looking for, but this might help:
http://www.alistapart.com/articles/dropdowns

Unfortunately, this does require some javascript as IE doesn't support
a few CSS elements.

Cheers,
Jelina



On Tue, Jun 29, 2010 at 9:30 AM,  grant_malcolm_bai...@westnet.com.au wrote:

 Hello,

 I would be grateful if someone could clarify whether there is such a thing
 as a pure CSS expandable menu. The sort of thing I'm looking for is the
 expandable / collapsible hierachy commonly shown in the left-hand frame of
 Windows programs such as Explorer or Outlook.

 I'm trying to avoid use of Javascript due to accessibility concerns.

 Thank you and regards,

 Grant Bailey
 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS Expandable Menu

2010-06-28 Thread Stephane Blanchard
Hi Grant,

Maybe this can help: http://free-css-menu.com/vertical-css-menu.html

SteF.

On Mon, Jun 28, 2010 at 7:30 PM, grant_malcolm_bai...@westnet.com.auwrote:


 Hello,

 I would be grateful if someone could clarify whether there is such a thing
 as a pure CSS expandable menu. The sort of thing I'm looking for is the
 expandable / collapsible hierachy commonly shown in the left-hand frame of
 Windows programs such as Explorer or Outlook.

 I'm trying to avoid use of Javascript due to accessibility concerns.

 Thank you and regards,

 Grant Bailey

 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




-- 
stephaneblanchard.ca
designer web
www.twitter.com/stefblanchard
www.facebook.com/stefblanchard


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS Expandable Menu

2010-06-28 Thread Josh Godsiff
If you're talking about a tree-like menu, I've never come across a 
purely CSS one. It strikes me that CSS alone doesn't have the vocabulary 
to deal with something that requires an 'expanded' and 'collapsed' state.


If you're worried about accessibility, either

   * expand it all by default, and use JavaScript to collapse and
 expand it or
   * do a page-reload if there's simply too much content to have it all
 expanded at once. (And then disable that if a user has JS turned on).

This kind of thing is very easily accomplishable with something like 
jQuery, and you can generally work through or around any accessibility 
concerns.


- Josh
-- www.oxideinteractive.com.au

On 29/6/2010 9:30 AM, grant_malcolm_bai...@westnet.com.au wrote:


Hello,

I would be grateful if someone could clarify whether there is such a 
thing as a pure CSS expandable menu. The sort of thing I'm looking for 
is the expandable / collapsible hierachy commonly shown in the 
left-hand frame of Windows programs such as Explorer or Outlook.


I'm trying to avoid use of Javascript due to accessibility concerns.

Thank you and regards,

Grant Bailey
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] CSS Expandable Menu

2010-06-28 Thread Sam Dwyer
Hi Grant,
It’s great you’re looking for an accessible menu solution, but I’d recommend 
not throwing away javascript solutions in the process.
Yahoo has some great information on adding WAI-Aria roles and states to menu 
buttons using javascript that you may be able to adapt for your purposes 
without too much trouble.
http://developer.yahoo.com/yui/3/examples/node-focusmanager/node-focusmanager-3.html

They also provide a menu plugin that might be useful to you.
http://developer.yahoo.com/yui/examples/menu/menuwaiaria.html

Cheers,
S

From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On 
Behalf Of grant_malcolm_bai...@westnet.com.au
Sent: Tuesday, 29 June 2010 9:31 AM
To: wsg@webstandardsgroup.org
Subject: [WSG] CSS Expandable Menu


Hello,

I would be grateful if someone could clarify whether there is such a thing as a 
pure CSS expandable menu. The sort of thing I'm looking for is the expandable / 
collapsible hierachy commonly shown in the left-hand frame of Windows programs 
such as Explorer or Outlook.

I'm trying to avoid use of Javascript due to accessibility concerns.

Thank you and regards,

Grant Bailey


Please consider the environment before printing this e-mail.

The information contained in this email and any attachment is confidential and
may contain legally privileged or copyright material.   It is intended only for
the use of the addressee(s).  If you are not the intended recipient of this
email, you are not permitted to disseminate, distribute or copy this email or
any attachments.  If you have received this message in error, please notify the
sender immediately and delete this email from your system.  The ABC does not
represent or warrant that this transmission is secure or virus free.   Before
opening any attachment you should check for viruses.  The ABC's liability is
limited to resupplying any email and attachments.

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS Expandable Menu

2010-06-28 Thread Seona Bellamy
Hi Grant,

You're meaning the sort of tree-menu arrangements that have a little plus
next to items with children, and clicking the plus makes the children appear
and push the other elements further down, right?

I don't believe what you're looking for is possible, as that sort of
hierarchical menu requires changes that stick rather than just activating
on hover. CSS just isn't designed to do that sort of thing.

Then again, JavaScript doesn't automatically mean inaccessible. What
concerns in particular did you have about JS making the menu inaccessible?

Cheers,

Seona.

On 29 June 2010 09:30, grant_malcolm_bai...@westnet.com.au wrote:


 Hello,

 I would be grateful if someone could clarify whether there is such a thing
 as a pure CSS expandable menu. The sort of thing I'm looking for is the
 expandable / collapsible hierachy commonly shown in the left-hand frame of
 Windows programs such as Explorer or Outlook.

 I'm trying to avoid use of Javascript due to accessibility concerns.

 Thank you and regards,

 Grant Bailey

 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] CSS Expandable Menu

2010-06-28 Thread Thierry Koblentz
Hi Grant,

 I'm trying to avoid use of Javascript due to accessibility concerns.

There is no problem with using a javascript powered menu as long as that menu 
is accessible with javascript off.
As a side note, pure CSS menus usually come with usability issues.


--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz






***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS Expandable Menu

2010-06-28 Thread Ted Drake
The YUI3 menu widget has great accessibility support
http://developer.yahoo.com/yui/3/node-menunav/

Accessibility  Usability Minded
The MenuNav Node Plugin was built with both accessibility and usability in 
mind. The MenuNav Node Plugin implements established mouse and keyboard 
interaction patterns to deliver a user experience that is both familiar and 
easy to use. To that foundation the MenuNav Node plugin adds support for screen 
readers through the use of the WAI-ARIA Roles and States. Watch this video for 
a quick a demo of a menu created using the MenuNav Node Plugin using the 
WAI-ARIA Roles and States running in Firefox 3 using the Window-Eyes screen 
reader.





-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On 
Behalf Of Thierry Koblentz
Sent: Monday, June 28, 2010 4:56 PM
To: wsg@webstandardsgroup.org
Subject: RE: [WSG] CSS Expandable Menu

Hi Grant,

 I'm trying to avoid use of Javascript due to accessibility concerns.

There is no problem with using a javascript powered menu as long as that menu 
is accessible with javascript off.
As a side note, pure CSS menus usually come with usability issues.


--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz






***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

[WSG] css drop down input

2010-02-11 Thread PurencoolGmail

Hi everyone

I have a input drop down field that I need to controls its width.
I know I can put a class or id in the tags but I don't want to do it
that way.

Here is the css where I can get a text box to work but
I can't get the drop down to do the same thing



#menu input#s {
width: 80%;
margin:0px 0px 5px 0px;
background: #fff;
border: 1px solid #999;
color: #000;
}


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS off button

2010-02-07 Thread Jayachandran Kandasamy
Hi  Paul,

You can use select drop down box instead of buttons for the CSS switching -
this can minimize the space in page and usability will be effective for the
end users

On Thu, Feb 4, 2010 at 8:51 PM, Paul Novitski p...@juniperwebcraft.comwrote:

 At 2/4/2010 10:43 AM, Erickson, Kevin (DOE) wrote:

 Here is the page using your example: 
 http://www.doetest.vi.virginia.gov/z_testing_area/kevin/test-css-off-from-wsg2.shtml
 
 http://www.doetest.vi.virginia.gov/z_testing_area/kevin/test-css-off-from-wsg2.shtml



 I recommend that you give folks a corresponding button to turn styling back
 on after they switch it off.


 Paul
 __

 Paul Novitski
 Juniper Webcraft Ltd.
 http://juniperwebcraft.com


 ***
  List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS Validation Error

2010-02-04 Thread David Dorward
 
On 4 Feb 2010, at 07:42, Joshua Street wrote:
 The validator does correctly parse as per the spec. The spec defines a way 
 for vendor prefixes to exist without conflicting with anything in CSS, no 
 more. This makes them part of the grammar, not the vocabulary, and the 
 validator checks both. The CSS 2.1 specification says Authors should avoid 
 vendor-specific extensions.
 
 I agree vendor-specific extensions do not constitute acceptable
 vocabulary, but as the specification allows a grammatical means for
 their inclusion it seems counter-productive to flag them as errors.

It provides a means for vendors to experiment without conflicting with real 
CSS, and for authors to *test* those features.

 The specification assures authors and vendors that An initial dash or
 underscore is guaranteed never to be used in a property or keyword by
 any current or future level of CSS - and, accordingly, they are (and
 will remain) grammatically permissible / safe for use. The imperative
 to avoid these extensions lacks explanation and, while this list is
 (by virtue of our name!) perhaps not the place for such views, seems
 to stem from the desire to preserve the appearance of standardisation
 rather than maximising the utility and flexibility of the standard in
 question.

The appearance of standardisation? The whole point of vendor extensions is that 
they are non-standard. Some of them are experimental implementations of 
standard features, some of them are experimental implementations of proposed 
features which may appear in future standards, some of them are outright 
proprietary. They are not standard.

 As a counterpoint to this, of course, using standards-compliant
 techniques to achieve an outcome will more successfully preserve
 interoperability into the future. However, I would assert the advice
 to avoid vendor-specific extensions should be constrained by this,
 rather than suggesting that a guaranteed future-compatible (albeit
 potentially no longer functional, contingent on ongoing vendor
 support) identifier should be avoided unswervingly.

They aren't guaranteed future-compatible. 

Vendor: We propose this feature and have implemented this as -vendor-foo

Other Vendor: Well, it has these problems, what if ...

Vendor: OK. We've changed the way it works.

All the slightly older clients supporting the original implementation promptly 
break.


How would this be implemented anyway?

Anything that looks like a vendor prefix works?

-moz-bowder-wadius: 

Congratulations! It is valid! 

But why doesn't it work?

Or does someone try to maintain a list of all the different extensions? The CSS 
2.1 specification lists 12 known vendors who use the vendor prefix. Who is 
going to maintain a central list of all proprietary extensions and the values 
they accept? How would they be versioned?


-- 
David Dorward
http://dorward.me.uk



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS off button

2010-02-04 Thread Erickson, Kevin (DOE)
Thanks Jayachandran!
 
That definitely works but is there a way that it could keep the CSS off
when the visitor leaves the page? Using a cookie maybe?
Here is the page using your example:
http://www.doetest.vi.virginia.gov/z_testing_area/kevin/test-css-off-fro
m-wsg2.shtml
 
Thank you,
Kevin



From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Jayachandran Kandasamy
Sent: Wednesday, January 27, 2010 2:25 AM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] CSS off button


Hi Kevin,
 
I have tried some sample code for switching off the CSS in jQuery.
 
Please go through this code below and let me know how far it is helping
you - if need anyother assistance please reply 
 
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN
HTML
HEAD
TITLE New Document /TITLE
META NAME=Generator CONTENT=EditPlus
META NAME=Author CONTENT=
META NAME=Keywords CONTENT=
META NAME=Description CONTENT=
script src=http://code.jquery.com/jquery-latest.js;/script
http://code.jquery.com/jquery-latest.js%22%3E%3C/script 
link href=css/sample.css type=text/css rel=stylesheet/
style type=text/css
body {
 background-color: #acc;
 color: #fff;
 font-size: 25px;
}
/style
style type=text/css
.chumma {
 background-color: #ff9900;
 color: #123456;
 font-size: 30px;
 width: 500px;
 height: 500px;
}
/style
script type=text/javascript
 $(document).ready(function(){
  $(input.offButt).click(function() {
   if($(head:has(style))  $(head:has(link))){
$(head:has(style)).remove();
$(head:has(link)).remove();
   }
  });
 });
/script
/HEAD
BODY
Sample for CSS off
form name=sampleForm
input type=button value=Click to Off the CSS class=offButt
id=offButt /
div class=chummaHi Kevin/div
div class=nameWebsite group - Kevin/div
/form
/BODY
/HTML

Thanks,
JC

On Fri, Jan 22, 2010 at 12:22 PM, Erickson, Kevin (DOE)
kevin.erick...@doe.virginia.gov wrote:


Hello fellow WSG'ers.
 
Could anyone please tell me if there is a right way to put a
clickable button in a web page that will turn off all CSS?
 
Thanks,
Kevin


***
List Guidelines:
http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org

*** 



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


RE: [WSG] CSS off button

2010-02-04 Thread Erickson, Kevin (DOE)
Sorry. That question wasn't very clear. I meant when the visitor goes to
other pages on the site I would like the CSS to remain off using a
cookie. Do you have a way to do that?



From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Erickson, Kevin (DOE)
Sent: Thursday, February 04, 2010 1:44 PM
To: wsg@webstandardsgroup.org
Subject: RE: [WSG] CSS off button


Thanks Jayachandran!
 
That definitely works but is there a way that it could keep the CSS off
when the visitor leaves the page? Using a cookie maybe?
Here is the page using your example:
http://www.doetest.vi.virginia.gov/z_testing_area/kevin/test-css-off-fro
m-wsg2.shtml
 
Thank you,
Kevin



From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Jayachandran Kandasamy
Sent: Wednesday, January 27, 2010 2:25 AM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] CSS off button


Hi Kevin,
 
I have tried some sample code for switching off the CSS in jQuery.
 
Please go through this code below and let me know how far it is helping
you - if need anyother assistance please reply 
 
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN
HTML
HEAD
TITLE New Document /TITLE
META NAME=Generator CONTENT=EditPlus
META NAME=Author CONTENT=
META NAME=Keywords CONTENT=
META NAME=Description CONTENT=
script src=http://code.jquery.com/jquery-latest.js;/script
http://code.jquery.com/jquery-latest.js%22%3E%3C/script 
link href=css/sample.css type=text/css rel=stylesheet/
style type=text/css
body {
 background-color: #acc;
 color: #fff;
 font-size: 25px;
}
/style
style type=text/css
.chumma {
 background-color: #ff9900;
 color: #123456;
 font-size: 30px;
 width: 500px;
 height: 500px;
}
/style
script type=text/javascript
 $(document).ready(function(){
  $(input.offButt).click(function() {
   if($(head:has(style))  $(head:has(link))){
$(head:has(style)).remove();
$(head:has(link)).remove();
   }
  });
 });
/script
/HEAD
BODY
Sample for CSS off
form name=sampleForm
input type=button value=Click to Off the CSS class=offButt
id=offButt /
div class=chummaHi Kevin/div
div class=nameWebsite group - Kevin/div
/form
/BODY
/HTML

Thanks,
JC

On Fri, Jan 22, 2010 at 12:22 PM, Erickson, Kevin (DOE)
kevin.erick...@doe.virginia.gov wrote:


Hello fellow WSG'ers.
 
Could anyone please tell me if there is a right way to put a
clickable button in a web page that will turn off all CSS?
 
Thanks,
Kevin


***
List Guidelines:
http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org

*** 



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


Re: [WSG] CSS Validation Error

2010-02-04 Thread James Ellis
Hi

I guess it's understand the consequences and use at your own risk. I doubt a
vendor will change the spelling and if they do, I'm pretty sure they'd
maintain BC by allowing both to work.
Using the example of *-radius, the vendor differences are more to do with
what the values selected will render as rather than the naming, for instance
webkit allows elliptical curves while moz only allows regular curves:
http://www.css3.info/border-radius-apple-vs-mozilla/
Apparently, webkit more closely resembles the CSS3 spec. Mozilla may change
their interpretation leading to possibly unexpected results (which you can
then fix).

Opera is apparently going to be supporting 'border-radius' in an upcoming
Presto release.

The end-goal is for all the major browsers to switch to border-radius and
then ignore their vendor specifc version, to avoid conflicts.

There are plenty of options to create curve-edged boxes but the CSS method
is the easiest programatically to implement, followed by creating PNG
quadrants on the fly with Imagick or similar and positioning them using CSS.
Opera allows SVG backgrounds,
so they can be created on-the-fly as XML. Plenty of designers cap a box top
and bottom with two curved slices but that's a pain to implement in flexible
layouts.

To answer a question further back, yes border-radius should be last in the
list after the vendor extensions.

Cheers
James



 They aren't guaranteed future-compatible.

 Vendor: We propose this feature and have implemented this as -vendor-foo

 Other Vendor: Well, it has these problems, what if ...

 Vendor: OK. We've changed the way it works.

 All the slightly older clients supporting the original implementation
 promptly break.


 How would this be implemented anyway?

 Anything that looks like a vendor prefix works?

 -moz-bowder-wadius:

 Congratulations! It is valid!

 But why doesn't it work?

 Or does someone try to maintain a list of all the different extensions? The
 CSS 2.1 specification lists 12 known vendors who use the vendor prefix. Who
 is going to maintain a central list of all proprietary extensions and the
 values they accept? How would they be versioned?




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS off button

2010-02-04 Thread Jayachandran Kandasamy
Hi Kevin,

I will let you know about the cookie technique soon :)

On Thu, Feb 4, 2010 at 10:43 AM, Erickson, Kevin (DOE) 
kevin.erick...@doe.virginia.gov wrote:

  Thanks Jayachandran!

 That definitely works but is there a way that it could keep the CSS off
 when the visitor leaves the page? Using a cookie maybe?
 Here is the page using your example:
 http://www.doetest.vi.virginia.gov/z_testing_area/kevin/test-css-off-from-wsg2.shtml

 Thank you,
 Kevin

  --
 *From:* li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] *On
 Behalf Of *Jayachandran Kandasamy
 *Sent:* Wednesday, January 27, 2010 2:25 AM

 *To:* wsg@webstandardsgroup.org
 *Subject:* Re: [WSG] CSS off button

   Hi Kevin,

 I have tried some sample code for switching off the CSS in jQuery.

 Please go through this code below and let me know how far it is helping you
 - if need anyother assistance please reply

 !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN
 HTML
 HEAD
 TITLE New Document /TITLE
 META NAME=Generator CONTENT=EditPlus
 META NAME=Author CONTENT=
 META NAME=Keywords CONTENT=
 META NAME=Description CONTENT=
 script 
 src=http://code.jquery.com/jquery-latest.js;/scripthttp://code.jquery.com/jquery-latest.js%22%3E%3C/script
 
 link href=css/sample.css type=text/css rel=stylesheet/
 style type=text/css
 body {
  background-color: #acc;
  color: #fff;
  font-size: 25px;
   }
 /style
 style type=text/css
 .chumma {
  background-color: #ff9900;
  color: #123456;
  font-size: 30px;
  width: 500px;
  height: 500px;
 }
 /style
 script type=text/javascript
  $(document).ready(function(){
   $(input.offButt).click(function() {
if($(head:has(style))  $(head:has(link))){
 $(head:has(style)).remove();
 $(head:has(link)).remove();
}
   });
  });
 /script
 /HEAD
  BODY
 Sample for CSS off
 form name=sampleForm
 input type=button value=Click to Off the CSS class=offButt
 id=offButt /
 div class=chummaHi Kevin/div
 div class=nameWebsite group - Kevin/div
 /form
 /BODY
 /HTML
 Thanks,
 JC
  On Fri, Jan 22, 2010 at 12:22 PM, Erickson, Kevin (DOE) 
 kevin.erick...@doe.virginia.gov wrote:

  Hello fellow WSG'ers.

 Could anyone please tell me if there is a right way to put a clickable
 button in a web page that will turn off all CSS?

 Thanks,
 Kevin

 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***



 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***

 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] CSS off button

2010-02-04 Thread Paul Novitski

At 2/4/2010 10:43 AM, Erickson, Kevin (DOE) wrote:
Here is the page using your example: 
http://www.doetest.vi.virginia.gov/z_testing_area/kevin/test-css-off-from-wsg2.shtmlhttp://www.doetest.vi.virginia.gov/z_testing_area/kevin/test-css-off-from-wsg2.shtml



I recommend that you give folks a corresponding button to turn 
styling back on after they switch it off.


Paul
__

Paul Novitski
Juniper Webcraft Ltd.
http://juniperwebcraft.com 




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] CSS Validation Error

2010-02-03 Thread Daniel Anderson
When I am validating a site that I am working on using the W3C Validator  I
get errors with *-moz-border-radius-bottomleft*.

Is this because it is CSS3?

Error Reads:
Property -moz-border-radius-bottomleft doesn't exist : 5px 5px

Cheers

Daniel


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] CSS Validation Error

2010-02-03 Thread Thierry Koblentz
-moz is a vendor prefix (not CSS3)

 

 

--

Regards,

Thierry | www.tjkdesign.com

 

 

 

From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On
Behalf Of Daniel Anderson
Sent: Wednesday, February 03, 2010 3:12 PM
To: wsg
Subject: [WSG] CSS Validation Error

 

When I am validating a site that I am working on using the W3C Validator  I
get errors with -moz-border-radius-bottomleft.

Is this because it is CSS3?

Error Reads:
Property -moz-border-radius-bottomleft doesn't exist : 5px 5px

Cheers

Daniel

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS Validation Error

2010-02-03 Thread Joshua Street
On Thu, Feb 4, 2010 at 10:23 AM, Thierry Koblentz
thierry.koble...@gmail.com wrote:
 -moz is a vendor prefix (not CSS3)

Actually, vendor prefixes are a part of both CSS 2.1
http://www.w3.org/TR/CSS21/syndata.html#vendor-keywords as well as the
CSS3 working draft... they're for proprietary extensions, of course,
but it's always seemed odd to me that the validator doesn't recognise
a vendor-prefix as per spec (irrespective of the specific vendor
extension) and ignore it accordingly.

-- 
Josh Street

http://josh.st/
+61 (0) 425 808 469


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS Validation Error

2010-02-03 Thread James Ellis
Hi

You can safely ignore any -prefix validation errors (-moz, -webkit, -opera)
- they are never going to validate on the W3C validator. The point of the
vendor specific rules is to do stuff the W3C haven't standardised yet.

The validator should probably ignore them as well. If you really must have a
valid stylesheet then you can stick vendor specific stuff in a vendor.css
and not validate it (because it won't).

#blob {
 border-radius : 5px;
 -webkit-border-radius : 5px;/* safari, chrome, arora etc */
 -moz-border-radius : 5px;/* firefox and pals*/
 -khtml-border-radius : 5px;/* konquerer */
}

Noting that webkit and moz have different names for the rules, watch out for
that.

Theoretically, when a browser supports border-radius, it should switch from
its vendor specific rule to the standard rule.

Cheers
James


On Thu, Feb 4, 2010 at 10:23 AM, Thierry Koblentz 
thierry.koble...@gmail.com wrote:

  -moz is a vendor prefix (not CSS3)





 --

 Regards,

 Thierry | www.tjkdesign.com







 *From:* li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] *On
 Behalf Of *Daniel Anderson
 *Sent:* Wednesday, February 03, 2010 3:12 PM
 *To:* wsg
 *Subject:* [WSG] CSS Validation Error



 When I am validating a site that I am working on using the W3C Validator  I
 get errors with *-moz-border-radius-bottomleft*.

 Is this because it is CSS3?

 Error Reads:
 Property -moz-border-radius-bottomleft doesn't exist : 5px 5px

 Cheers

 Daniel




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] CSS Validation Error

2010-02-03 Thread Thierry Koblentz
 From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
 On Behalf Of Joshua Street
 Sent: Wednesday, February 03, 2010 5:59 PM
 To: wsg@webstandardsgroup.org
 Subject: Re: [WSG] CSS Validation Error
 
 On Thu, Feb 4, 2010 at 10:23 AM, Thierry Koblentz
 thierry.koble...@gmail.com wrote:
  -moz is a vendor prefix (not CSS3)
 
 Actually, vendor prefixes are a part of both CSS 2.1
 http://www.w3.org/TR/CSS21/syndata.html#vendor-keywords as well as the
 CSS3 working draft... they're for proprietary extensions, of course,
 but it's always seemed odd to me that the validator doesn't recognise
 a vendor-prefix as per spec (irrespective of the specific vendor
 extension) and ignore it accordingly.

The prefix may be part of it to address parsing issues, but - afaik - that
does not make these extensions CSS properties. 


--
Regards,
Thierry | www.tjkdesign.com






***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS Validation Error

2010-02-03 Thread Thierry Koblentz
 #blob {
 border-radius : 5px;
 -webkit-border-radius : 5px;/* safari, chrome, arora etc */
 -moz-border-radius : 5px;/* firefox and pals*/
 -khtml-border-radius : 5px;/* konquerer */
 }


I believe it would make more sense to reverse that order and have
border-radius come *last* in the declaration block 


--
Regards,
Thierry | www.tjkdesign.com



From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On
Behalf Of James Ellis
Sent: Wednesday, February 03, 2010 6:10 PM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] CSS Validation Error

Hi

You can safely ignore any -prefix validation errors (-moz, -webkit, -opera)
- they are never going to validate on the W3C validator. The point of the
vendor specific rules is to do stuff the W3C haven't standardised yet.

The validator should probably ignore them as well. If you really must have a
valid stylesheet then you can stick vendor specific stuff in a vendor.css
and not validate it (because it won't).

#blob {
 border-radius : 5px;
 -webkit-border-radius : 5px;/* safari, chrome, arora etc */
 -moz-border-radius : 5px;/* firefox and pals*/
 -khtml-border-radius : 5px;/* konquerer */
}

Noting that webkit and moz have different names for the rules, watch out for
that.

Theoretically, when a browser supports border-radius, it should switch from
its vendor specific rule to the standard rule.

Cheers
James

On Thu, Feb 4, 2010 at 10:23 AM, Thierry Koblentz
thierry.koble...@gmail.com wrote:
-moz is a vendor prefix (not CSS3)
 
 
--
Regards,
Thierry | www.tjkdesign.com
 
 
 
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On
Behalf Of Daniel Anderson
Sent: Wednesday, February 03, 2010 3:12 PM
To: wsg
Subject: [WSG] CSS Validation Error
 
When I am validating a site that I am working on using the W3C Validator  I
get errors with -moz-border-radius-bottomleft.

Is this because it is CSS3?

Error Reads:
Property -moz-border-radius-bottomleft doesn't exist : 5px 5px

Cheers

Daniel



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS Validation Error

2010-02-03 Thread Joshua Street
On Thu, Feb 4, 2010 at 1:22 PM, Thierry Koblentz
thierry.koble...@gmail.com wrote:
 On Thu, Feb 4, 2010 at 10:23 AM, Thierry Koblentz
 thierry.koble...@gmail.com wrote:
  -moz is a vendor prefix (not CSS3)

 Actually, vendor prefixes are a part of both CSS 2.1
 http://www.w3.org/TR/CSS21/syndata.html#vendor-keywords as well as the
 CSS3 working draft... they're for proprietary extensions, of course,
 but it's always seemed odd to me that the validator doesn't recognise
 a vendor-prefix as per spec (irrespective of the specific vendor
 extension) and ignore it accordingly.

 The prefix may be part of it to address parsing issues, but - afaik - that
 does not make these extensions CSS properties.

Indeed - yet therein lies the frustration at the validator failing to
correctly parse as per spec.

-- 
Josh Street

http://josh.st/
+61 (0) 425 808 469


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS Validation Error

2010-02-03 Thread David Dorward
 
On 4 Feb 2010, at 03:29, Joshua Street wrote:
 
 The prefix may be part of it to address parsing issues, but - afaik - that
 does not make these extensions CSS properties.
 
 Indeed - yet therein lies the frustration at the validator failing to
 correctly parse as per spec.


The validator does correctly parse as per the spec. The spec defines a way for 
vendor prefixes to exist without conflicting with anything in CSS, no more. 
This makes them part of the grammar, not the vocabulary, and the validator 
checks both. The CSS 2.1 specification says Authors should avoid 
vendor-specific extensions.

-- 
David Dorward
http://dorward.me.uk



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS Validation Error

2010-02-03 Thread Joshua Street
On Thu, Feb 4, 2010 at 6:16 PM, David Dorward da...@dorward.me.uk wrote:
 On 4 Feb 2010, at 03:29, Joshua Street wrote:
 The prefix may be part of it to address parsing issues, but - afaik - that
 does not make these extensions CSS properties.

 Indeed - yet therein lies the frustration at the validator failing to
 correctly parse as per spec.

 The validator does correctly parse as per the spec. The spec defines a way 
 for vendor prefixes to exist without conflicting with anything in CSS, no 
 more. This makes them part of the grammar, not the vocabulary, and the 
 validator checks both. The CSS 2.1 specification says Authors should avoid 
 vendor-specific extensions.

I agree vendor-specific extensions do not constitute acceptable
vocabulary, but as the specification allows a grammatical means for
their inclusion it seems counter-productive to flag them as errors.

The specification assures authors and vendors that An initial dash or
underscore is guaranteed never to be used in a property or keyword by
any current or future level of CSS - and, accordingly, they are (and
will remain) grammatically permissible / safe for use. The imperative
to avoid these extensions lacks explanation and, while this list is
(by virtue of our name!) perhaps not the place for such views, seems
to stem from the desire to preserve the appearance of standardisation
rather than maximising the utility and flexibility of the standard in
question.

As a counterpoint to this, of course, using standards-compliant
techniques to achieve an outcome will more successfully preserve
interoperability into the future. However, I would assert the advice
to avoid vendor-specific extensions should be constrained by this,
rather than suggesting that a guaranteed future-compatible (albeit
potentially no longer functional, contingent on ongoing vendor
support) identifier should be avoided unswervingly.

So I guess my problem is with the language of the specification as
much as with the validator - but I feel there is probably enough
ambiguity in the specification around this (i.e. why introduce a
feature only to advise authors to avoid implementations applying this
feature?!) that the validator should, on the basis of grammar, accept
flexible vocabulary following this dash (-) or underscore (_) prefix.

There are good, pragmatic reasons for both approaches - but erring on
the side of flexibility here does nothing to damage the abilities of
compliant user-agents, or the fabric of the standards-based web.
Particularly in seasons where we wait for finalisation of good and
important features into usable, non-draft-form standards, the
validator's interpretation remains unhelpful.

-- 
Josh Street

http://josh.st/
+61 (0) 425 808 469


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS off button

2010-01-27 Thread Oliver Boermans
On 27 January 2010 17:55, Jayachandran Kandasamy
jayachandran.kandas...@gmail.com wrote:
  $(document).ready(function(){
   $(input.offButt).click(function() {
    if($(head:has(style))  $(head:has(link))){
 $(head:has(style)).remove();
 $(head:has(link)).remove();
    }
   });
  });

I’m pretty sure this will remove the head element and everything in it.
Link elements are also used for more than just loading CSS so you
wouldn’t want to remove them without checking the type or rel
attribute too.

Regarding the JavaScript
http://api.jquery.com/
http://forum.jquery.com/

Cheers
Ollie


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS off button

2010-01-27 Thread Jayachandran Kandasamy
Oliver,

This wont remove the head element but only the style and link tags .. but I
didnt do the attribute level, I will try it out man.. thanks for the
suggestion :)

Cheers
JC


On Wed, Jan 27, 2010 at 5:48 PM, Oliver Boermans boerm...@gmail.com wrote:

 On 27 January 2010 17:55, Jayachandran Kandasamy
 jayachandran.kandas...@gmail.com wrote:
   $(document).ready(function(){
$(input.offButt).click(function() {
 if($(head:has(style))  $(head:has(link))){
  $(head:has(style)).remove();
  $(head:has(link)).remove();
 }
});
   });

 I’m pretty sure this will remove the head element and everything in it.
 Link elements are also used for more than just loading CSS so you
 wouldn’t want to remove them without checking the type or rel
 attribute too.

 Regarding the JavaScript
 http://api.jquery.com/
 http://forum.jquery.com/

 Cheers
 Ollie


 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


Re: [WSG] CSS off button

2010-01-26 Thread Jayachandran Kandasamy
Hi Kevin,

I have tried some sample code for switching off the CSS in jQuery.

Please go through this code below and let me know how far it is helping you
- if need anyother assistance please reply

!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN
HTML
HEAD
TITLE New Document /TITLE
META NAME=Generator CONTENT=EditPlus
META NAME=Author CONTENT=
META NAME=Keywords CONTENT=
META NAME=Description CONTENT=
script 
src=http://code.jquery.com/jquery-latest.js;/scripthttp://code.jquery.com/jquery-latest.js%22%3E%3C/script

link href=css/sample.css type=text/css rel=stylesheet/
style type=text/css
body {
 background-color: #acc;
 color: #fff;
 font-size: 25px;
}
/style
style type=text/css
.chumma {
 background-color: #ff9900;
 color: #123456;
 font-size: 30px;
 width: 500px;
 height: 500px;
}
/style
script type=text/javascript
 $(document).ready(function(){
  $(input.offButt).click(function() {
   if($(head:has(style))  $(head:has(link))){
$(head:has(style)).remove();
$(head:has(link)).remove();
   }
  });
 });
/script
/HEAD
BODY
Sample for CSS off
form name=sampleForm
input type=button value=Click to Off the CSS class=offButt
id=offButt /
div class=chummaHi Kevin/div
div class=nameWebsite group - Kevin/div
/form
/BODY
/HTML
Thanks,
JC
On Fri, Jan 22, 2010 at 12:22 PM, Erickson, Kevin (DOE) 
kevin.erick...@doe.virginia.gov wrote:

  Hello fellow WSG'ers.

 Could anyone please tell me if there is a right way to put a clickable
 button in a web page that will turn off all CSS?

 Thanks,
 Kevin

 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] CSS off button

2010-01-25 Thread Erickson, Kevin (DOE)
Yes. I have a prototype with the imports and it DOES work. Thanks 

-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Ted Drake
Sent: Friday, January 22, 2010 5:46 PM
To: wsg@webstandardsgroup.org
Subject: RE: [WSG] CSS off button

That's because you have so many different css files
link rel=stylesheet href=/styles/import/508.css
type=text/css /
link rel=stylesheet href=/styles/import/core.css
type=text/css /

link rel=stylesheet href=/styles/import/body_content.css
type=text/css /
link rel=stylesheet href=/styles/import/general_html.css
type=text/css /
link rel=stylesheet href=/styles/import/header.css
type=text/css /
link rel=stylesheet href=/styles/import/leftnav.css
type=text/css /
link rel=stylesheet href=/styles/import/rightnav.css
type=text/css /
link rel=stylesheet href=/styles/import/custom_styles.css
type=text/css /
link rel=stylesheet href=/styles/import/footer.css
type=text/css /

It might work better if you had a base css that included imports within
it to the sub css files. When you switch that with a new css file the
imports should also be skipped. I haven't tested that, but I think it
would work.



-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Erickson, Kevin (DOE)
Sent: Friday, January 22, 2010 2:27 PM
To: wsg@webstandardsgroup.org
Subject: RE: [WSG] CSS off button

Thanks for the responses.
The reason I am looking for something along these lines it to have a
text only look. A state requirement by State of Virginia for all
government web sites.
I like the style switcher idea which I am already using but when I
switch to an alternate style it only changes what I specify in that
alternate CSS file. A blank CSS file would change nothing. Or am I
missing something about how to use the style switcher. I have it used in
the far right of the banner for changing the text size here:
http://www.doe.virginia.gov.

cheers

-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Oliver Boermans
Sent: Friday, January 22, 2010 4:54 PM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] CSS off button

Hi Kevin

On 23 January 2010 06:52, Erickson, Kevin (DOE)
kevin.erick...@doe.virginia.gov wrote:
 Could anyone please tell me if there is a right way to put a clickable

 button in a web page that will turn off all CSS?

Why do you want to switch off CSS?
Reasons aside, the simplest method that jumps to my mind is to use an
empty alternate stylesheet and some JavaScript to switch between it and
the default [presuming you have all your style in the one external CSS
file].

This rather old article explains the concept
http://www.alistapart.com/articles/alternate/

If you have the option, a server-side approach as Paul suggests would be
more reliable as it would work without JavaScript.

Comes back to why!?

Hope that helps
Ollie


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS off button

2010-01-22 Thread Paul Novitski

At 1/22/2010 12:22 PM, Erickson, Kevin (DOE) wrote:
Could anyone please tell me if there is a right way to put a 
clickable button in a web page that will turn off all CSS?



To be perhaps overly precise, I'm guessing that you probably don't 
want to turn off *all* styling because that would render your 
document as one long string of undifferentiated text, but instead you 
want to keep the browser's default styling and/or the user's custom 
styling and suppress the page author's additional styling.


The approach would most likely be to strip out the style elements 
from the html head and the style attributes from all elements on the 
page. I think it would be unreasonable to ask a program to also 
suppress styling imposed by client-side scripting but if you were 
being paid enough this would be doable.


The best practice way to do this would be, first of all, to provide a 
submit button or link that asked a server-side script to re-deliver 
the current page with style elements and attributes removed. Then you 
could add a JavaScript layer that intercepted the button click and 
stripped away styling on the fly. I don't think removing the style 
elements in the head after a page is rendered has the desired effect, 
so you'd probably have to delete all the children of the style object 
in addition to deleting the style attributes on the page.


Depending on your purpose, you'd also want to decide whether to strip 
other presentational elements and attributes at the same time.


Regards,

Paul
__

Paul Novitski
Juniper Webcraft Ltd.
http://juniperwebcraft.com 




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS off button

2010-01-22 Thread Oliver Boermans
Hi Kevin

On 23 January 2010 06:52, Erickson, Kevin (DOE)
kevin.erick...@doe.virginia.gov wrote:
 Could anyone please tell me if there is a right way to put a clickable
 button in a web page that will turn off all CSS?

Why do you want to switch off CSS?
Reasons aside, the simplest method that jumps to my mind is to use an
empty alternate stylesheet and some JavaScript to switch between it
and the default [presuming you have all your style in the one external
CSS file].

This rather old article explains the concept
http://www.alistapart.com/articles/alternate/

If you have the option, a server-side approach as Paul suggests would
be more reliable as it would work without JavaScript.

Comes back to why!?

Hope that helps
Ollie


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS off button

2010-01-22 Thread Ted Drake
I think your requirements may be a bit confused.
I would suggest you look at two articles
1. backwards compatible style switcher
http://www.alistapart.com/articles/n4switch/
2. zoom layout by Sir Joe Clark
http://www.alistapart.com/articles/lowvision/

Joe tells you why it's a good idea to create an alternate style sheet
that is single column, stark, and full of contrast. You could use this
theory to switch your user to a simplified style sheet that still
maintains some control 

The style switcher is the script that you are looking for. It's the
disable css button. If you really want to turn off css, just have it
switch to an empty css file.

Ted


-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Oliver Boermans
Sent: Friday, January 22, 2010 1:54 PM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] CSS off button

Hi Kevin

On 23 January 2010 06:52, Erickson, Kevin (DOE)
kevin.erick...@doe.virginia.gov wrote:
 Could anyone please tell me if there is a right way to put a clickable
 button in a web page that will turn off all CSS?

Why do you want to switch off CSS?
Reasons aside, the simplest method that jumps to my mind is to use an
empty alternate stylesheet and some JavaScript to switch between it
and the default [presuming you have all your style in the one external
CSS file].

This rather old article explains the concept
http://www.alistapart.com/articles/alternate/

If you have the option, a server-side approach as Paul suggests would
be more reliable as it would work without JavaScript.

Comes back to why!?

Hope that helps
Ollie


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS off button

2010-01-22 Thread Erickson, Kevin (DOE)
Thanks for the responses.
The reason I am looking for something along these lines it to have a
text only look. A state requirement by State of Virginia for all
government web sites.
I like the style switcher idea which I am already using but when I
switch to an alternate style it only changes what I specify in that
alternate CSS file. A blank CSS file would change nothing. Or am I
missing something about how to use the style switcher. I have it used in
the far right of the banner for changing the text size here:
http://www.doe.virginia.gov.

cheers

-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Oliver Boermans
Sent: Friday, January 22, 2010 4:54 PM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] CSS off button

Hi Kevin

On 23 January 2010 06:52, Erickson, Kevin (DOE)
kevin.erick...@doe.virginia.gov wrote:
 Could anyone please tell me if there is a right way to put a clickable

 button in a web page that will turn off all CSS?

Why do you want to switch off CSS?
Reasons aside, the simplest method that jumps to my mind is to use an
empty alternate stylesheet and some JavaScript to switch between it and
the default [presuming you have all your style in the one external CSS
file].

This rather old article explains the concept
http://www.alistapart.com/articles/alternate/

If you have the option, a server-side approach as Paul suggests would be
more reliable as it would work without JavaScript.

Comes back to why!?

Hope that helps
Ollie


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS off button

2010-01-22 Thread Ted Drake
That's because you have so many different css files
link rel=stylesheet href=/styles/import/508.css
type=text/css /
link rel=stylesheet href=/styles/import/core.css
type=text/css /

link rel=stylesheet href=/styles/import/body_content.css
type=text/css /
link rel=stylesheet href=/styles/import/general_html.css
type=text/css /
link rel=stylesheet href=/styles/import/header.css
type=text/css /
link rel=stylesheet href=/styles/import/leftnav.css
type=text/css /
link rel=stylesheet href=/styles/import/rightnav.css
type=text/css /
link rel=stylesheet href=/styles/import/custom_styles.css
type=text/css /
link rel=stylesheet href=/styles/import/footer.css
type=text/css /

It might work better if you had a base css that included imports within
it to the sub css files. When you switch that with a new css file the
imports should also be skipped. I haven't tested that, but I think it
would work.



-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Erickson, Kevin (DOE)
Sent: Friday, January 22, 2010 2:27 PM
To: wsg@webstandardsgroup.org
Subject: RE: [WSG] CSS off button

Thanks for the responses.
The reason I am looking for something along these lines it to have a
text only look. A state requirement by State of Virginia for all
government web sites.
I like the style switcher idea which I am already using but when I
switch to an alternate style it only changes what I specify in that
alternate CSS file. A blank CSS file would change nothing. Or am I
missing something about how to use the style switcher. I have it used in
the far right of the banner for changing the text size here:
http://www.doe.virginia.gov.

cheers

-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Oliver Boermans
Sent: Friday, January 22, 2010 4:54 PM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] CSS off button

Hi Kevin

On 23 January 2010 06:52, Erickson, Kevin (DOE)
kevin.erick...@doe.virginia.gov wrote:
 Could anyone please tell me if there is a right way to put a clickable

 button in a web page that will turn off all CSS?

Why do you want to switch off CSS?
Reasons aside, the simplest method that jumps to my mind is to use an
empty alternate stylesheet and some JavaScript to switch between it and
the default [presuming you have all your style in the one external CSS
file].

This rather old article explains the concept
http://www.alistapart.com/articles/alternate/

If you have the option, a server-side approach as Paul suggests would be
more reliable as it would work without JavaScript.

Comes back to why!?

Hope that helps
Ollie


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] css vallidation

2010-01-21 Thread Jayachandran Kandasamy
Hi Marvin,

Why there are several properties for the same selector and written twice ..
few of them repeating .. can you please optimise it ?
Try giving the background-color: transparent instead of
background:transparent and try out..

May be some problem with the validator
On Wed, Jan 20, 2010 at 1:02 AM, Marvin Hunkin startrekc...@gmail.comwrote:

 hi.
 how to fix this.
 will paste my errors and the css.
 and what colours to put in for names.
 cheers Marvin.

  The W3C CSS Validation Service
 W3C CSS Validator results for

 C:\Docs\Tafe\CertificateFourWebsites\CertFour\PrinciplesOfVisualDesign\PrinciplesOfVisualDesign\styles\joe_style.css
 (CSS level 2.1)

 Jump to:Errors (2)Validated CSS
 W3C CSS Validator results for

 C:\Docs\Tafe\CertificateFourWebsites\CertFour\PrinciplesOfVisualDesign\PrinciplesOfVisualDesign\styles\joe_style.css
 (CSS level 2.1)
 Sorry! We found the following errors (2)
 URI :

 C:\Docs\Tafe\CertificateFourWebsites\CertFour\PrinciplesOfVisualDesign\PrinciplesOfVisualDesign\styles\joe_style.css
 83 #navigation li a  Value Error : background-color left is not a color
 value : left left
 95 #footer li a  Value Error : background-color left is not a color value :
 left left

 ? Top

 The W3C validators rely on community support for hosting and development.
 Donate and help us build better tools for a better web.
 Valid CSS information
 p.first:first-letter {
 text-transform : capitalize;
 font-style : italic;
 }
 body {
 font : 100%/1.4 Helvetica Neue, Arial, sans-serif;
 background : #fff;
 }
 .left {
 float : left;
 padding : 0 8px 8px 0;
 }
 .clear {
 clear : left;
 }
 h1 {
 text-align : center;
 }
 h2 {
 text-align : center;
 }
 a:link {
 color : #008000;
 }
 a:visited {
 color : #22bb22;
 }
 div#links a span {
 display : none;
 }
 div#links a:hover span {
 display : block;
 position : absolute;
 top : 350px;
 left : 5px;
 width : 100px;
 text-decoration : none;
 }
 a:hover {
 background-color : #006400;
 color : #ff;
 }
 a:active {
 color : #ff;
 text-decoration : none;
 }
 #banner {
 text-align : center;
 }
 #content {
 margin-left : 10px;
 margin-right : 10px;
 voice-family : \}\;
 voice-family : inherit;
 margin-left : 131px;
 margin-right : 131px;
 }
 body #content {
 margin-left : 10px;
 margin-right : 10px;
 }
 #nav {
 position : absolute;
 left : 10px;
 top : 100px;
 width : 100px;
 text-align : center;
 }
 #wrapper {
 width : 960px;
 background-color : #fff;
 margin : 10px auto 0 auto;
 }
 #banner_new {
 text-align : center;
 }
 #navigation {
 margin : 10px;
 overflow : hidden;
 }
 #navigation li {
 display : block;
 float : left;
 }
 *#navigation li a {
 display : block;
 float : left;
 background-image :

 url('../../Local%20Settings/Temporary%20Internet%20Files/Content.IE5/images/nav_banana.png');
 background-repeat : no-repeat;
 background-attachment : scroll;
 padding-left : 32px;
 padding-right : 16px;
 padding-top : 0;
 padding-bottom : 20px;
 background-position : top;
 }
 #navigation li a {
 display : block;
 float : left;
 background : transparent;
 padding : 0 16px 20px 0;
 }
 *#main_content {
 margin : 10px;
 }
 .specials {
 float : left;
 width : 470px;
 height : 250px;
 }
 .specials img {
 float : left;
 padding : 10px;
 }
 #footer {
 margin : 10px;
 overflow : hidden;
 }
 #footer li {
 display : block;
 float : left;
 }
 #footer li a {
 display : block;
 float : left;
 background-image :

 url('../../Local%20Settings/Temporary%20Internet%20Files/Content.IE5/images/nav_banana.png');
 background-repeat : no-repeat;
 background-attachment : scroll;
 padding-left : 32px;
 padding-right : 16px;
 padding-top : 0;
 padding-bottom : 20px;
 background-position : top;
 }
 ? Top

 Home |About |Documentation |Download |Feedback |Credits


 Copyright © 1994-2009 W3C® (MIT, ERCIM, Keio), All Rights Reserved. W3C
 liability, trademark, document use and software licensing rules apply. Your
 interactions with this site are in accordance with our public and Member
 privacy statements.


 p.first:first-letter
 {
 text-transform:capitalize;
 font-style: italic;
 }
 body
 {
 font: 100%/1.4 Helvetica Neue, Arial, sans-serif;
 background: #fff;
 }
 .left { float: left; padding: 0 8px 8px 0; }
 .clear {clear: left; }
 h1
 {
 text-align: center;
 }
 h2
 {
 text-align: center;
 }
 a:link
 {
 color: #008000;
 }
 a:visited
 {
 color: #22bb22;
 }
 div#links a span
 {
 display: none;
 }
 div#links a:hover span
 {
 display: block;
 position: absolute;
 top: 350px;
 left: 5px;
 width: 100px;
 text-decoration: none;
 }
 a:hover
 {
 background-color: #006400;
 color: #FF;
 }
 a:active
 {
 color: #FF;
 text-decoration: none;
 }
 #banner
 {
 text-align: center;
  }
 #content
 {
 margin-left: 10px;
 margin-right:10px;
 voice-family: \}\;
 voice-family: inherit;
 margin-left: 131px;
 margin-right:131px;
  }
 body #content {
 margin-left: 10px;
 margin-right:10px;
  }
  #nav
 {
 position: absolute;
 left: 10px;
 top: 100px;
 width: 100px;
 text-align: center;
 }
 #wrapper { 

[WSG] css vallidation

2010-01-20 Thread Marvin Hunkin
hi.
how to fix this.
will paste my errors and the css.
and what colours to put in for names.
cheers Marvin.

 The W3C CSS Validation Service
W3C CSS Validator results for 
C:\Docs\Tafe\CertificateFourWebsites\CertFour\PrinciplesOfVisualDesign\PrinciplesOfVisualDesign\styles\joe_style.css
 
(CSS level 2.1)

Jump to:Errors (2)Validated CSS
W3C CSS Validator results for 
C:\Docs\Tafe\CertificateFourWebsites\CertFour\PrinciplesOfVisualDesign\PrinciplesOfVisualDesign\styles\joe_style.css
 
(CSS level 2.1)
Sorry! We found the following errors (2)
URI : 
C:\Docs\Tafe\CertificateFourWebsites\CertFour\PrinciplesOfVisualDesign\PrinciplesOfVisualDesign\styles\joe_style.css
83 #navigation li a  Value Error : background-color left is not a color 
value : left left
95 #footer li a  Value Error : background-color left is not a color value : 
left left

? Top

The W3C validators rely on community support for hosting and development.
Donate and help us build better tools for a better web.
Valid CSS information
p.first:first-letter {
text-transform : capitalize;
font-style : italic;
}
body {
font : 100%/1.4 Helvetica Neue, Arial, sans-serif;
background : #fff;
}
.left {
float : left;
padding : 0 8px 8px 0;
}
.clear {
clear : left;
}
h1 {
text-align : center;
}
h2 {
text-align : center;
}
a:link {
color : #008000;
}
a:visited {
color : #22bb22;
}
div#links a span {
display : none;
}
div#links a:hover span {
display : block;
position : absolute;
top : 350px;
left : 5px;
width : 100px;
text-decoration : none;
}
a:hover {
background-color : #006400;
color : #ff;
}
a:active {
color : #ff;
text-decoration : none;
}
#banner {
text-align : center;
}
#content {
margin-left : 10px;
margin-right : 10px;
voice-family : \}\;
voice-family : inherit;
margin-left : 131px;
margin-right : 131px;
}
body #content {
margin-left : 10px;
margin-right : 10px;
}
#nav {
position : absolute;
left : 10px;
top : 100px;
width : 100px;
text-align : center;
}
#wrapper {
width : 960px;
background-color : #fff;
margin : 10px auto 0 auto;
}
#banner_new {
text-align : center;
}
#navigation {
margin : 10px;
overflow : hidden;
}
#navigation li {
display : block;
float : left;
}
#navigation li a {
display : block;
float : left;
background-image : 
url('../../Local%20Settings/Temporary%20Internet%20Files/Content.IE5/images/nav_banana.png');
background-repeat : no-repeat;
background-attachment : scroll;
padding-left : 32px;
padding-right : 16px;
padding-top : 0;
padding-bottom : 20px;
background-position : top;
}
#navigation li a {
display : block;
float : left;
background : transparent;
padding : 0 16px 20px 0;
}
#main_content {
margin : 10px;
}
.specials {
float : left;
width : 470px;
height : 250px;
}
.specials img {
float : left;
padding : 10px;
}
#footer {
margin : 10px;
overflow : hidden;
}
#footer li {
display : block;
float : left;
}
#footer li a {
display : block;
float : left;
background-image : 
url('../../Local%20Settings/Temporary%20Internet%20Files/Content.IE5/images/nav_banana.png');
background-repeat : no-repeat;
background-attachment : scroll;
padding-left : 32px;
padding-right : 16px;
padding-top : 0;
padding-bottom : 20px;
background-position : top;
}
? Top

Home |About |Documentation |Download |Feedback |Credits


Copyright © 1994-2009 W3C® (MIT, ERCIM, Keio), All Rights Reserved. W3C 
liability, trademark, document use and software licensing rules apply. Your 
interactions with this site are in accordance with our public and Member 
privacy statements.


p.first:first-letter
{
text-transform:capitalize;
font-style: italic;
}
body
{
font: 100%/1.4 Helvetica Neue, Arial, sans-serif;
background: #fff;
}
.left { float: left; padding: 0 8px 8px 0; }
.clear {clear: left; }
h1
{
text-align: center;
}
h2
{
text-align: center;
}
a:link
{
color: #008000;
}
a:visited
{
color: #22bb22;
}
div#links a span
{
display: none;
}
div#links a:hover span
{
display: block;
position: absolute;
top: 350px;
left: 5px;
width: 100px;
text-decoration: none;
}
a:hover
{
background-color: #006400;
color: #FF;
}
a:active
{
color: #FF;
text-decoration: none;
}
#banner
{
text-align: center;
 }
#content
{
margin-left: 10px;
margin-right:10px;
voice-family: \}\;
voice-family: inherit;
margin-left: 131px;
margin-right:131px;
 }
body #content {
margin-left: 10px;
margin-right:10px;
 }
 #nav
{
position: absolute;
left: 10px;
top: 100px;
width: 100px;
text-align: center;
}
#wrapper { width: 960px; background-color: #fff; margin: 10px auto 0 auto;}
#banner_new { text-align: center; }
#navigation { margin: 10px; overflow: hidden;}
#navigation li { display:block; float:left; }
#navigation li a { display: block; float: left; background-image:
   
url('../../Local%20Settings/Temporary%20Internet%20Files/Content.IE5/images/nav_banana.png');
   background-repeat: no-repeat; background-color: left;
   background-attachment: scroll; padding-left: 32px;
   padding-right: 16px; padding-top: 0; padding-bottom: 20px;
  

Re: [WSG] css tutorial

2010-01-15 Thread Matthew Pennell
On Fri, Jan 15, 2010 at 7:03 AM, Chris F.A. Johnson ch...@cfajohnson.comwrote:

   Every other discussion group I participate in regards clagnut
   with derision.

   There is no good reason for anything other than font-size: 100%.


That's not an explanation. ALA published a follow-up by Richard on the same
topic, do they not know what they're talking about either?

- Matthew


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] css tutorial

2010-01-15 Thread Thierry Koblentz
 Also, please try our Opera Web Standards Curriculum section 27 entitled CSS 
 basics,
 written and contributed by Christian Heilmann. 

 Here is the hyperlink to it: http://dev.opera.com/articles/view/27-css-basics/

There are a bunch of typos in there.
- Extra semi-colons,
- The :first-line and :first-letter pseudo-elements contain 2 --
- There is an extra ( in the :lang() pseudo-class example.

Also, because of the uniqueness nature of ID, I'm not sure the example below 
makes much sense (unless the author uses the same ID on various elements across 
a site).

div#example{}
matches the element with the id attribute example, but only when it is a div

Things like that don't help people who are looking for basic tutorials because 
if they come to learn the syntax we can't expect them to spot typos or bad 
practice.


--
Regards,
Thierry | www.tjkdesign.com






***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] css tutorial

2010-01-15 Thread tee
 
On Jan 15, 2010, at 1:45 AM, Matthew Pennell wrote:

 On Fri, Jan 15, 2010 at 7:03 AM, Chris F.A. Johnson ch...@cfajohnson.com 
 wrote:
   Every other discussion group I participate in regards clagnut
   With derision.
 
   There is no good reason for anything other than font-size: 100%.
 
 That's not an explanation. ALA published a follow-up by Richard on the same 
 topic, do they not know what they're talking about either?
 
 - Matthew 
 http://www.clagnut.com/blog/348/

I have great difficulty to read the above site  (16px in body tag) and the 
dev.opera in my 27 iMac which is 2560 x 1440 resolution. Firefox web developer 
reveals that it has a 13px for p tag, but I find it hard to read, perhaps the 
font is the cause. Mezzo Blue has 12px yet it's more readable.

Font size in smaller percentage or pixel in body tag creates more problem for 
larger screen? Apple sold million copies of its new iMac, likely is just a drop 
in computer user pool, it does however brought to my attention to have to pay 
attention to these users.

tee



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


RE: [WSG] css tutorial

2010-01-15 Thread Thierry Koblentz
  On Fri, Jan 15, 2010 at 7:03 AM, Chris F.A. Johnson
ch...@cfajohnson.com wrote:
  Every other discussion group I participate in regards clagnut
  with derision.

  There is no good reason for anything other than font-size: 100%.

 That's not an explanation. ALA published a follow-up by Richard on the
same topic, 
 do they not know what they're talking about either?

Actually, on ALA I find the text small and the sans-serif font does not
help.
I have a user styles sheet that sets the font-size on body (100%). It turns
out that the sites that think they get it right for most users are the
ones that look the weirdest.
One I'm surprised to find in that batch is
http://www.paciellogroup.com/blog/
With font-size:100% one gets huge *and* tiny fonts on the same page. 
Imho, this goes against allowing users to browse the web the way *they*
choose.

--
Regards,
Thierry | www.tjkdesign.com







***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] css error

2010-01-15 Thread Marvin Hunkin
hi.
well how to fix this.
and could this be releated to the internet explorer 8 problem.
please help me out and show me how to fix this error in my css.
that is what i am asking you knowelable people on this list.
Marvin. 




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] css error

2010-01-15 Thread David Laakso

Marvin Hunkin wrote:

hi.
well how to fix this.

Marvin. 




  



Go to your CSS file.
Find the declaration that reads:
body
{
font: 100%/1.4 Helvetica Neue, Arial, sans-serif; -- :: add
background: #fff;
}

Amend that declaration to read:
body
{
font: 100%/1.4 Helvetica Neue, Arial, sans-serif;
background: #fff;
}


Reply to the list. Not me. Thank you, Marvin.
Best,
~d


--
desktop
http://chelseacreekstudio.com/
mobile
http://chelseacreekstudio.mobi/



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] css tutorial

2010-01-14 Thread Marvin Hunkin
hi.
well a member of blind geeks.
and asked to write a short basic tutorial on css.
did learn css in my web design course in 2007.
and di use it a bit to tweek a web project recently.
but my question is:
what resources and what links to some tutorials to get a handle on how to 
write a short css tutorial.
and how to write one.
and what do i need to put in it.
just asking.
i do know css, but a bit rusty.
and totally blind.
so the biggest problem, where things are located on screen.
so any one got any ideas where to start and how to write a tutorial for this 
technical group.
Marvin. 




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] css tutorial

2010-01-14 Thread Robert Turner

Hi Marvin,

The w3schools tutorial is handy: http://www.w3schools.com/css/css_intro.asp
The reference is useful too: http://www.w3schools.com/css/css_reference.asp

Cheers,
Rob

Marvin Hunkin wrote:

hi.
well a member of blind geeks.
and asked to write a short basic tutorial on css.
did learn css in my web design course in 2007.
and di use it a bit to tweek a web project recently.
but my question is:
what resources and what links to some tutorials to get a handle on how to 
write a short css tutorial.

and how to write one.
and what do i need to put in it.
just asking.
i do know css, but a bit rusty.
and totally blind.
so the biggest problem, where things are located on screen.
so any one got any ideas where to start and how to write a tutorial for this 
technical group.
Marvin. 





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

  



--
*Rob Turner*
Founder

www. f l e x a d a t a .com http://flexadata.com

*+1 415 448 7652*
*+61 7 3040 1337*





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***attachment: rob.vcf

Re: [WSG] css tutorial

2010-01-14 Thread Doug Burt

Marvin,
You may want to try checking out the W3Schools at 
http://www.w3schools.com/css/default.asp
That site should provide you with way more than enough information to do a 
couple of tutorials..


Cheers,
DougB

- Original Message - 
From: Marvin Hunkin startrekc...@gmail.com

To: wsg@webstandardsgroup.org
Sent: Thursday, January 14, 2010 3:56 PM
Subject: [WSG] css tutorial



hi.
well a member of blind geeks.
and asked to write a short basic tutorial on css.
did learn css in my web design course in 2007.
and di use it a bit to tweek a web project recently.
but my question is:
what resources and what links to some tutorials to get a handle on how to
write a short css tutorial.
and how to write one.
and what do i need to put in it.
just asking.
i do know css, but a bit rusty.
and totally blind.
so the biggest problem, where things are located on screen.
so any one got any ideas where to start and how to write a tutorial for 
this

technical group.
Marvin.




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***







***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] css tutorial

2010-01-14 Thread Chris F.A. Johnson
On Thu, 14 Jan 2010, Doug Burt wrote:

 Marvin,
 You may want to try checking out the W3Schools at
 http://www.w3schools.com/css/default.asp
 That site should provide you with way more than enough information to do a
 couple of tutorials..

 Unless their CSS tutorial is better than their HTML, I'd avoid
 w3schools like the plague!


 - Original Message - From: Marvin Hunkin startrekc...@gmail.com
 To: wsg@webstandardsgroup.org
 Sent: Thursday, January 14, 2010 3:56 PM
 Subject: [WSG] css tutorial
 
 
  hi.
  well a member of blind geeks.
  and asked to write a short basic tutorial on css.
  did learn css in my web design course in 2007.
  and di use it a bit to tweek a web project recently.
  but my question is:
  what resources and what links to some tutorials to get a handle on how to
  write a short css tutorial.
  and how to write one.
  and what do i need to put in it.
  just asking.
  i do know css, but a bit rusty.
  and totally blind.
  so the biggest problem, where things are located on screen.
  so any one got any ideas where to start and how to write a tutorial for this
  technical group.
  Marvin.
  
  
  
  
  ***
  List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
  Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
  Help: memberh...@webstandardsgroup.org
  ***
  
  
 
 
 
 
 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***
 

-- 
   Chris F.A. Johnson  http://cfajohnson.com
   ===
   Author:
   Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
   Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] css tutorial

2010-01-14 Thread Andrew Cooper
 
Hi Marvin,

 

If you're looking for help on CSS and some reference materials then I can't 
recommend the SitePoint CSS Reference [Located at: 
http://reference.sitepoint.com/css] highly enough. And as Chris said, I'd avoid 
W3Schools.com like the plague, it is severely lacking in up to date tutorial 
materials.

 

All the best,

 

Andrew Cooper

 

P.S This is my first reply in the WSG Mailing List! :)
 
 Date: Thu, 14 Jan 2010 19:35:45 -0500
 From: ch...@cfajohnson.com
 To: wsg@webstandardsgroup.org
 Subject: Re: [WSG] css tutorial
 
 On Thu, 14 Jan 2010, Doug Burt wrote:
 
  Marvin,
  You may want to try checking out the W3Schools at
  http://www.w3schools.com/css/default.asp
  That site should provide you with way more than enough information to do a
  couple of tutorials..
 
 Unless their CSS tutorial is better than their HTML, I'd avoid
 w3schools like the plague!
 
 
  - Original Message - From: Marvin Hunkin startrekc...@gmail.com
  To: wsg@webstandardsgroup.org
  Sent: Thursday, January 14, 2010 3:56 PM
  Subject: [WSG] css tutorial
  
  
   hi.
   well a member of blind geeks.
   and asked to write a short basic tutorial on css.
   did learn css in my web design course in 2007.
   and di use it a bit to tweek a web project recently.
   but my question is:
   what resources and what links to some tutorials to get a handle on how to
   write a short css tutorial.
   and how to write one.
   and what do i need to put in it.
   just asking.
   i do know css, but a bit rusty.
   and totally blind.
   so the biggest problem, where things are located on screen.
   so any one got any ideas where to start and how to write a tutorial for 
   this
   technical group.
   Marvin.
   
   
   
   
   ***
   List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
   Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
   Help: memberh...@webstandardsgroup.org
   ***
   
   
  
  
  
  
  ***
  List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
  Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
  Help: memberh...@webstandardsgroup.org
  ***
  
 
 -- 
 Chris F.A. Johnson http://cfajohnson.com
 ===
 Author:
 Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
 Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress)
 
 
 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***
 
  
_
We want to hear all your funny, exciting and crazy Hotmail stories. Tell us now
http://clk.atdmt.com/UKM/go/195013117/direct/01/

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


Re: [WSG] css tutorial

2010-01-14 Thread tee
On Jan 14, 2010, at 5:44 PM, Andrew Cooper wrote:

 Hi Marvin,
  
 If you're looking for help on CSS and some reference materials then I can't 
 recommend the SitePoint CSS Reference [Located 
 at:http://reference.sitepoint.com/css] highly enough. And as Chris said, I'd 
 avoid W3Schools.com like the plague, it is severely lacking in up to date 
 tutorial materials.


How could nobody mentions  http://css.maxdesign.com.au/

We owe Russ this much :)


tee

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


Re: [WSG] css tutorial

2010-01-14 Thread Frank Palinkas
Hi Marvin.

Also, please try our Opera Web Standards Curriculum section 27 entitled CSS
basics, written and contributed by Christian Heilmann.

Here is the hyperlink to it:
http://dev.opera.com/articles/view/27-css-basics/

Hope this helps you out a bit,

Med vennlig hilsen / Kind regards,

Frank M. Palinkas
Technical Writer
Opera Software ASA, Oslo, Norway
http://dev.opera.com/articles/accessibility/



On Fri, Jan 15, 2010 at 12:56 AM, Marvin Hunkin startrekc...@gmail.comwrote:

 hi.
 well a member of blind geeks.
 and asked to write a short basic tutorial on css.
 did learn css in my web design course in 2007.
 and di use it a bit to tweek a web project recently.
 but my question is:
 what resources and what links to some tutorials to get a handle on how to
 write a short css tutorial.
 and how to write one.
 and what do i need to put in it.
 just asking.
 i do know css, but a bit rusty.
 and totally blind.
 so the biggest problem, where things are located on screen.
 so any one got any ideas where to start and how to write a tutorial for
 this
 technical group.
 Marvin.




 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] css tutorial

2010-01-14 Thread Chris F.A. Johnson
On Fri, 15 Jan 2010, Frank Palinkas wrote:

 Hi Marvin.
 
 Also, please try our Opera Web Standards Curriculum section 27 entitled CSS
 basics, written and contributed by Christian Heilmann.
 
 Here is the hyperlink to it:
 http://dev.opera.com/articles/view/27-css-basics/

   I find it hard to take it seriously when it has
   body { font-size:62.5%; } in http://dev.opera.com/css/screen.css


 On Fri, Jan 15, 2010 at 12:56 AM, Marvin Hunkin startrekc...@gmail.comwrote:
 
  hi.
  well a member of blind geeks.
  and asked to write a short basic tutorial on css.
  did learn css in my web design course in 2007.
  and di use it a bit to tweek a web project recently.
  but my question is:
  what resources and what links to some tutorials to get a handle on how to
  write a short css tutorial.
  and how to write one.
  and what do i need to put in it.
  just asking.
  i do know css, but a bit rusty.
  and totally blind.
  so the biggest problem, where things are located on screen.
  so any one got any ideas where to start and how to write a tutorial for
  this
  technical group.

-- 
   Chris F.A. Johnson  http://cfajohnson.com
   ===
   Author:
   Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
   Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] css tutorial

2010-01-14 Thread Matthew Pennell
On Fri, Jan 15, 2010 at 6:17 AM, Chris F.A. Johnson ch...@cfajohnson.comwrote:

   I find it hard to take it seriously when it has
   body { font-size:62.5%; } in http://dev.opera.com/css/screen.css


If you're going to snipe, it's a good idea to provide an explanation and say
why you think something is a bad idea.

http://www.clagnut.com/blog/348/

- Matthew


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] css tutorial

2010-01-14 Thread Chris F.A. Johnson
On Fri, 15 Jan 2010, Matthew Pennell wrote:

 On Fri, Jan 15, 2010 at 6:17 AM, Chris F.A. Johnson 
 ch...@cfajohnson.comwrote:
 
I find it hard to take it seriously when it has
body { font-size:62.5%; } in http://dev.opera.com/css/screen.css
 
 
 If you're going to snipe, it's a good idea to provide an explanation and say
 why you think something is a bad idea.
 
 http://www.clagnut.com/blog/348/

   Every other discussion group I participate in regards clagnut
   with derision.

   There is no good reason for anything other than font-size: 100%.

-- 
   Chris F.A. Johnson  http://cfajohnson.com
   ===
   Author:
   Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
   Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS Popup

2010-01-12 Thread Tom Livingston
On Mon, Jan 11, 2010 at 3:14 PM, David Hucklesby huckle...@gmail.com wrote:
 On 1/11/10 11:25 AM, Tom Livingston wrote:

 Hello list,

 I tried to repurpose this example from Eric Meyer:
 http://meyerweb.com/eric/css/edge/popups/demo.html

 His page works in IE6.

 My attempt, however, does not. Can anyone see why?
 http://www.mlinc.com/css_popup/

 Thanks in advance


 Yup. You need to give an explicit rule for a:hover to get IE 6 to
 cooperate. Not all properties work, either, IIRC. My choice is

  a:hover { background-position: 0 0; }

 YMMV.
 Cordially,
 David
 --



Superb! Thanks so much! [insert grumbling about IE 6 here]


-- 

Tom Livingston | Senior Interactive Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] CSS Popup

2010-01-11 Thread Tom Livingston
Hello list,

I tried to repurpose this example from Eric Meyer:
http://meyerweb.com/eric/css/edge/popups/demo.html

His page works in IE6.

My attempt, however, does not. Can anyone see why?
http://www.mlinc.com/css_popup/

Thanks in advance


-- 

Tom Livingston | Senior Interactive Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS Popup

2010-01-11 Thread David Hucklesby

On 1/11/10 11:25 AM, Tom Livingston wrote:

Hello list,

I tried to repurpose this example from Eric Meyer:
http://meyerweb.com/eric/css/edge/popups/demo.html

His page works in IE6.

My attempt, however, does not. Can anyone see why?
http://www.mlinc.com/css_popup/

Thanks in advance


Yup. You need to give an explicit rule for a:hover to get IE 6 to 
cooperate. Not all properties work, either, IIRC. My choice is


  a:hover { background-position: 0 0; }

YMMV.
Cordially,
David
--



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS list-style

2009-10-07 Thread michael.brockington
Chris,
I am not sure what system you tested this on, but it doesn't work on any
system I tried, and indeed it shouldn't: the marker is a part of the LI
not of the UL.

Regards,
Mike

Mike Brockington
Web Development Specialist

www.calcResult.com
www.stephanieBlakey.me.uk
www.edinburgh.gov.uk

This message does not reflect the opinions of any entity other than the
author alone.

 

-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Chris F.A. Johnson
Sent: 06 October 2009 19:00
To: wsg
Subject: Re: [WSG] CSS list-style

On Tue, 6 Oct 2009, Richard Mather wrote:


ul
 li class=blackcontent/li
/ul
 
ul {
color:#380;
list-style-type:disc;
}

ul li.black {
color:#000;
}



-- 
   Chris F.A. Johnson, webmaster http://woodbine-gerrard.com
   ===
   Author:
   Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS list-style

2009-10-07 Thread Chris F.A. Johnson
On Wed, 7 Oct 2009, michael.brocking...@bt.com wrote:

 Chris,
 I am not sure what system you tested this on, but it doesn't work on any
 system I tried, and indeed it shouldn't: the marker is a part of the LI
 not of the UL.

http://www.w3.org/TR/CSS21/generate.html#propdef-list-style-type

!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN
HTML
   HEAD
 TITLELowercase latin numbering/TITLE
 STYLE type=text/css
  ol { list-style-type: lower-roman }   
 /STYLE
  /HEAD
  BODY
OL
  LI This is the first item.
  LI This is the second item.
  LI This is the third item.
/OL
  /BODY
/HTML


 
 -Original Message-
 From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
 On Behalf Of Chris F.A. Johnson
 Sent: 06 October 2009 19:00
 To: wsg
 Subject: Re: [WSG] CSS list-style
 
 On Tue, 6 Oct 2009, Richard Mather wrote:
 
 
 ul
  li class=blackcontent/li
 /ul
  
 ul {
 color:#380;
 list-style-type:disc;
 }
 
 ul li.black {
 color:#000;
 }
 
 
 
 

-- 
   Chris F.A. Johnson, webmaster http://woodbine-gerrard.com
   ===
   Author:
   Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS list-style

2009-10-07 Thread Mark Henderson
Chris F.A. Johnson wrote:
 ul
  li class=blackcontent/li
 /ul

 ul {
 color:#380;
 list-style-type:disc;
 }

 ul li.black {
 color:#000;
 }

Then apparently Michael Brockington wrote:
 Chris,
 I am not sure what system you tested this on, but it doesn't work on 
 any system I tried, and indeed it shouldn't: the marker is a part of 
 the LI not of the UL.


I believe the problem with this is that the list-style-type is inherited
(it's fine to place it on the UL/OL), so with that last rule you find
both the text and the bullet are black. IIRC there's no easy way around
this apart from using an image or a span, as you are already aware.


HTH
Mark



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] CSS list-style

2009-10-06 Thread Richard Mather
Hi all,

I'm wondering about colouring bullet points in a ul and wanted to know if
there was a way of having the list-style: a different colour to the text
within the li without having to resort to putting it all within a
spanas per my example:

ul
lispancontent/span/li
/ul

ul {
color:#380;
list-style-type:disc;
}
ul li span {
color:#000;
}


Many thanks
Rich


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS list-style

2009-10-06 Thread Chris F.A. Johnson
On Tue, 6 Oct 2009, Richard Mather wrote:

 Hi all,
 
 I'm wondering about colouring bullet points in a ul and wanted to know if
 there was a way of having the list-style: a different colour to the text
 within the li without having to resort to putting it all within a
 spanas per my example:
 
 ul
 lispancontent/span/li
 /ul
 
 ul {
 color:#380;
 list-style-type:disc;
 }
 ul li span {
 color:#000;
 }

ul
 li class=blackcontent/li
/ul
 
ul {
color:#380;
list-style-type:disc;
}

ul li.black {
color:#000;
}



-- 
   Chris F.A. Johnson, webmaster http://woodbine-gerrard.com
   ===
   Author:
   Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] CSS list-style

2009-10-06 Thread Raul Ferrer
Hi Rich,

 

You can always get rid of the list-style-type and add the disc as an image
in whichever color you want.

I think that on CSS2.1 the disc (or letters or numbers for that matter) will
always be the same color of the list element or as you say, having to add a
span, which is ugly.

 

Cheers

 

Raul

 

  _  

De: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] En
nombre de Richard Mather
Enviado el: martes, 06 de octubre de 2009 19:48
Para: wsg
Asunto: [WSG] CSS list-style

 

Hi all,

I'm wondering about colouring bullet points in a ul and wanted to know if
there was a way of having the list-style: a different colour to the text
within the li without having to resort to putting it all within a span
as per my example:

ul
lispancontent/span/li
/ul

ul {
color:#380;
list-style-type:disc;
}
ul li span {
color:#000;
}


Many thanks
Rich



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

[WSG] CSS Styling in IE

2009-06-18 Thread Nass Martino - Yehget
Hi Everyone,
 
I am having an issue with IE (as most do).
 
http://www.buildline.com.au/newsite/home.aspx
 
The text under the flash sits perfectly in Firefox, but sits off centre in
IE. It should be in line with the left side of the flash.
 
Can someone explain to me how to fix this.
 
Thank you in advance.

Nass Martino 
YEHGET MULTYMEDIA



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS Styling in IE

2009-06-18 Thread Adam Smith


Hey Nass,

It looks like the floated details with Buildline Constructions' address detailsare what's jagging IE; 

Check out: http://www.positioniseverything.net/explorer/floatIndent.htmlfor an explanation; and some ways to fix


Kind regards,

Ads,


Adam Smith 
Operations Analyst 





Network Ten 1 Saunders Street , Pyrmont NSW 2009 , Australia




Telephone +61 (02) 9650 0931.Facsimile +61 (02) 9650 1070 .Mobile +61 404 987 690 
adsm...@networkten.com.au 
ten.com.au

masterchef.com.au
australianidol.com.au
rovedaily.com.au
dance.ten.com.au
ten.com.au.On 19/06/2009 at 12:46 pm, "Nass Martino - Yehget" n...@yehget.com.au wrote:

Hi Everyone,

I am having an issue with IE (as most do).

http://www.buildline.com.au/newsite/home.aspx

The text under the flash sits perfectly in Firefox, but sits off centre in IE.It should be in line with the left side of the flash.

Can someone explain to me how to fix this.

Thank you in advance.

Nass Martino YEHGET MULTYMEDIA***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: memberh...@webstandardsgroup.org*** 
Network Ten Pty Ltd ABN 91 052 515 250


Network Ten Disclaimer
This e-mail (including all attachments) is intended solely for the named 
addressee. If you receive it in error, please let us know by reply e-mail, 
delete it from your system and destroy the copies. This e-mail is also 
subject to copyright. No part of it should be reproduced, adapted or 
transmitted without the written consent of the copyright owner. E-mails 
may be interfered with, may contain computer viruses or other defects and 
may not be successfully replicated on other systems. We give no warranties 
in relation to these matters. If you have any doubts about the authenticity 
of an e-mail purportedly sent by us, please contact us immediately.

***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: memberh...@webstandardsgroup.org***

Re: [WSG] CSS 3 Media Queries iPhone / Opera Mini 4

2009-05-30 Thread David Hucklesby

Christian Montoya wrote:

I am looking into delivering an iPhone-specific stylesheet and I came
across this:

For example, to specify a style sheet for iPhone, use an expression
similar to the following:
link media=only screen and (max-device-width: 480px)
href=small-device.css type= text/css rel=stylesheet


[...]
I have been playing with media queries coded directly in the style sheet 
with some success. These have worked in Opera since version 7, work now 
in Safari 3, and will work in Firefox 3.5. I am hopeful that both Opera- 
and Safari-based phones will display as I want, although I have yet to 
test in anything other than iPhoney - the iPhone emulator for Mac.


FWIW this article is the basis of my experiment:

http://dev.opera.com/articles/view/how-to-serve-the-right-content-to-mobile/

Hope this helps.

Cordially,
David
--



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] CSS 3 Media Queries iPhone / Opera Mini 4

2009-05-29 Thread Christian Montoya
I am looking into delivering an iPhone-specific stylesheet and I came
across this:

For example, to specify a style sheet for iPhone, use an expression
similar to the following:
link media=only screen and (max-device-width: 480px)
href=small-device.css type= text/css rel=stylesheet

To specify a style sheet for devices other than iPhone, use an
expression similar to the following:
link media=screen and (min-device-width: 481px)
href=not-small-device.css type=text/css rel=stylesheet

on this page: 
http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariWebContent/OptimizingforSafarioniPhone/chapter_3_section_2.html.

What I am finding is that I can apply a mobile stylesheet using the
first example, but all of my screen stylesheets are still applied. So
using the second example I could eliminate this, but my concern is
that other browsers will not understand the second example and
therefore not render any screen styles at all. What is the preferred
course of action here? Can I really inject a media query into all of
my link media attributes without affecting older browsers?

-- 
--
Christian Montoya
mappdev.com :: christianmontoya.net


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] CSS IE6/7 - what a surprise

2009-01-23 Thread Henrik Madsen


HI all,

I'm hoping there's a simple solution to my two problems.

All looks fine in Mac browsers x5 and IE8b2 (according to netrenderer)  
but not in:


IE6 - Mysterious margins are appearing between the header and the top  
menu and in both coloured boxes in the right hand column of the main  
content.


IE6+7 - the coloured boxes are not 'expanding' to contain the content  
(in this case a floated image in both)


I found this CSS as an alternative to a clearing div and it seems to  
fix things in other browsers - except those IE's:


#NameofContainingDiv:after {
clear: both;
content: .;
display: block;
height: 0px;
visibility: hidden;
}


Would anyone be able to have a look?

Here's the link:

http://www.igenerator.com.au/dev/sm09/homepage.html

Any other thoughts, comments, suggestions - always appreciated.

TIA,

Henrik Madsen
Generator
hen...@igenerator.com.au
www.igenerator.com.au



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] CSS IE6/7 - what a surprise

2009-01-23 Thread Dhanishth

Hi Guys,

This is my first posting.

For clearing floats other reference which could be checked are :
http://reference.sitepoint.com/css/floatclear

Also the book Everything You Know About CSS is Wrong page 26 
onwards  there is material


regards
dhanishth

At 02:06 PM 1/23/2009, you wrote:


HI all,

I'm hoping there's a simple solution to my two problems.

All looks fine in Mac browsers x5 and IE8b2 (according to 
netrenderer) but not in:


IE6 - Mysterious margins are appearing between the header and the 
top menu and in both coloured boxes in the right hand column of the 
main content.


IE6+7 - the coloured boxes are not 'expanding' to contain the 
content (in this case a floated image in both)


I found this CSS as an alternative to a clearing div and it seems to 
fix things in other browsers - except those IE's:


#NameofContainingDiv:after {
clear: both;
content: .;
display: block;
height: 0px;
visibility: hidden;
}


Would anyone be able to have a look?

Here's the link:

http://www.igenerator.com.au/dev/sm09/homepage.htmlhttp://www.igenerator.com.au/dev/sm09/homepage.html

Any other thoughts, comments, suggestions - always appreciated.

TIA,

Henrik Madsen
Generator
mailto:hen...@igenerator.com.auhen...@igenerator.com.au
www.igenerator.com.au


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

RE: [WSG] CSS IE6/7 - what a surprise

2009-01-23 Thread Damian Edwards
Most likely a lack of hasLayout triggers or layout context changes, or both.

For the coloured boxes, add overflow:hidden to the divs with classes 
catalougeMid and subscribeMid. This will force them into a new layout context 
and in turn expand the container to contain all elements. If you want it to 
apply to IE6 and IE7 only, use a selector hack:

* html .catalogueMid, * html .subscribeMid { overflow: hidden; } /* IE6 Only */
*:first-child+html .catalogueMid, *:first-child+html .subscribeMid { overflow: 
hidden; } /* IE7 Only */

I'd have to fire up a VM to look at the IE6 issue and it's late :)
Regards,
Damian Edwards
Microsoft MVPhttps://mvp.support.microsoft.com/profile/Damian.Edwards | 
ASP/ASP.NET
Readify | Senior Consultant
M: 0448 545 868 | E: 
damian.edwa...@readify.netmailto:damian.edwa...@readify.net | C: 
damian.edwa...@readify.netsip:damian.edwa...@readify.net | W: 
www.readify.nethttp://www.readify.net/

From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On 
Behalf Of Henrik Madsen
Sent: Friday, 23 January 2009 19:37
To: wsg@webstandardsgroup.org
Subject: [WSG] CSS IE6/7 - what a surprise


HI all,

I'm hoping there's a simple solution to my two problems.

All looks fine in Mac browsers x5 and IE8b2 (according to netrenderer) but not 
in:

IE6 - Mysterious margins are appearing between the header and the top menu and 
in both coloured boxes in the right hand column of the main content.

IE6+7 - the coloured boxes are not 'expanding' to contain the content (in this 
case a floated image in both)

I found this CSS as an alternative to a clearing div and it seems to fix things 
in other browsers - except those IE's:

#NameofContainingDiv:after {
clear: both;
content: .;
display: block;
height: 0px;
visibility: hidden;
}


Would anyone be able to have a look?

Here's the link:

http://www.igenerator.com.au/dev/sm09/homepage.html

Any other thoughts, comments, suggestions - always appreciated.

TIA,

Henrik Madsen
Generator
hen...@igenerator.com.aumailto:hen...@igenerator.com.au
www.igenerator.com.auhttp://www.igenerator.com.au/


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


Re: [WSG] CSS IE6/7 - what a surprise

2009-01-23 Thread Todd Budnikas
Damian probably gave you your answer, but I'll also say that if you  
review the original documentation from http://www.positioniseverything.net/easyclearing.html 
 for the code  you're using, you'll see that they recommend  
conditional comments to trigger hasLayout. In your case, in the head  
of your document you should add:


!--[if IE]
style type=text/css
  #NameofContainingDiv:after {
zoom: 1; /* triggers hasLayout */
}  /* Only IE can see inside the conditional comment
and read this CSS rule. Don't ever use a normal HTML
comment inside the CC or it will close prematurely. */
/style
![endif]--

Either way, the end goal is the same.


On Jan 23, 2009, at 5:15 AM, Damian Edwards wrote:

Most likely a lack of hasLayout triggers or layout context changes,  
or both.


For the coloured boxes, add overflow:hidden to the divs with classes  
catalougeMid and subscribeMid. This will force them into a new  
layout context and in turn expand the container to contain all  
elements. If you want it to apply to IE6 and IE7 only, use a  
selector hack:


* html .catalogueMid, * html .subscribeMid { overflow: hidden; } /*  
IE6 Only */
*:first-child+html .catalogueMid, *:first-child+html .subscribeMid  
{ overflow: hidden; } /* IE7 Only */


I’d have to fire up a VM to look at the IE6 issue and it’s late J
Regards,
Damian Edwards
Microsoft MVP | ASP/ASP.NET
Readify | Senior Consultant
M: 0448 545 868 | E: damian.edwa...@readify.net | C: damian.edwa...@readify.net 
 | W: www.readify.net


From: li...@webstandardsgroup.org  
[mailto:li...@webstandardsgroup.org] On Behalf Of Henrik Madsen

Sent: Friday, 23 January 2009 19:37
Subject: [WSG] CSS IE6/7 - what a surprise


HI all,
I'm hoping there's a simple solution to my two problems.
All looks fine in Mac browsers x5 and IE8b2 (according to  
netrenderer) but not in:
IE6 - Mysterious margins are appearing between the header and the  
top menu and in both coloured boxes in the right hand column of the  
main content.
IE6+7 - the coloured boxes are not 'expanding' to contain the  
content (in this case a floated image in both)
I found this CSS as an alternative to a clearing div and it seems to  
fix things in other browsers - except those IE's:


#NameofContainingDiv:after {
clear: both;
content: .;
display: block;
height: 0px;
visibility: hidden;
}

Would anyone be able to have a look?
Here's the link:
http://www.igenerator.com.au/dev/sm09/homepage.html
Any other thoughts, comments, suggestions - always appreciated.

TIA,

Henrik Madsen
Generator
hen...@igenerator.com.au
www.igenerator.com.au




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


Re: [WSG] CSS IE6/7 - what a surprise

2009-01-23 Thread David Dixon
Just to correct Todd's reply, the :after property isnt support by either 
IE7 or IE6 (and below), therefore you would need to adjust your CSS to 
state (assuming you're using a CSS hack, for ease of display):


#NameofContainingDiv {
*zoom: 1;
/* all your other styles for the element */
}

#NameofContainingDiv:after {
clear: both;
content: '.';
display: block;
height: 0;
visibility: hidden;
}

David

Todd Budnikas wrote:
Damian probably gave you your answer, but I'll also say that if you 
review the original documentation 
from http://www.positioniseverything.net/easyclearing.html for the code 
 you're using, you'll see that they recommend conditional comments to 
trigger hasLayout. In your case, in the head of your document you should 
add:


!--[if IE]
style type=text/css
  #NameofContainingDiv:after {
zoom: 1; /* triggers hasLayout */
}  /* Only IE can see inside the conditional comment
and read this CSS rule. Don't ever use a normal HTML
comment inside the CC or it will close prematurely. */
/style
![endif]--

Either way, the end goal is the same.


On Jan 23, 2009, at 5:15 AM, Damian Edwards wrote:

Most likely a lack of hasLayout triggers or layout context changes, or 
both.
 
For the coloured boxes, add overflow:hidden to the divs with classes 
catalougeMid and subscribeMid. This will force them into a new layout 
context and in turn expand the container to contain all elements. If 
you want it to apply to IE6 and IE7 only, use a selector hack:
 
* html .catalogueMid, * html .subscribeMid { overflow: hidden; } /* 
IE6 Only */
*:first-child+html .catalogueMid, *:first-child+html .subscribeMid { 
overflow: hidden; } /* IE7 Only */
 
I’d have to fire up a VM to look at the IE6 issue and it’s late J

Regards,
*Damian Edwards
*Microsoft MVP 
https://mvp.support.microsoft.com/profile/Damian.Edwards | ASP/ASP.NET

Readify | Senior Consultant
M: 0448 545 868 | E: damian.edwa...@readify.net 
mailto:damian.edwa...@readify.net | C: damian.edwa...@readify.net 
sip:damian.edwa...@readify.net | W: www.readify.net 
http://www.readify.net/
 
*From:* li...@webstandardsgroup.org 
mailto:li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] *On 
Behalf Of *Henrik Madsen

*Sent:* Friday, 23 January 2009 19:37
*Subject:* [WSG] CSS IE6/7 - what a surprise
 
 
HI all,

I'm hoping there's a simple solution to my two problems.
All looks fine in Mac browsers x5 and IE8b2 (according to 
netrenderer) but not in:
IE6 - Mysterious margins are appearing between the header and the top 
menu and in both coloured boxes in the right hand column of the main 
content.
IE6+7 - the coloured boxes are not 'expanding' to contain the content 
(in this case a floated image in both)
I found this CSS as an alternative to a clearing div and it seems to 
fix things in other browsers - except those IE's:
 
#NameofContainingDiv:after {

clear: both;
content: .;
display: block;
height: 0px;
visibility: hidden;
}
 
Would anyone be able to have a look?

Here's the link:
http://www.igenerator.com.au/dev/sm09/homepage.html
Any other thoughts, comments, suggestions - always appreciated.
 
TIA,
 
Henrik Madsen

*Generator*
hen...@igenerator.com.au mailto:hen...@igenerator.com.au
www.igenerator.com.au http://www.igenerator.com.au/



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS IE6/7 - what a surprise

2009-01-23 Thread Todd Budnikas
ack.. sincere apologies. If you view positioniseverything.net, they  
use a class of clearfix for this fix, and I think it is poor practice  
to add mark-up to help IE behave. However, David is correct, as i  
copied and pasted without checking myself. So the :after should have  
been left out for the IE conditionals.


Again, sincere apologies for misinformation.


On Jan 23, 2009, at 5:16 PM, David Dixon wrote:

Just to correct Todd's reply, the :after property isnt support by  
either IE7 or IE6 (and below), therefore you would need to adjust  
your CSS to state (assuming you're using a CSS hack, for ease of  
display):


#NameofContainingDiv {
   *zoom: 1;
   /* all your other styles for the element */
}

#NameofContainingDiv:after {
   clear: both;
   content: '.';
   display: block;
   height: 0;
   visibility: hidden;
}

David

Todd Budnikas wrote:
Damian probably gave you your answer, but I'll also say that if you  
review the original documentation from http://www.positioniseverything.net/easyclearing.html 
 for the code  you're using, you'll see that they recommend  
conditional comments to trigger hasLayout. In your case, in the  
head of your document you should add:

!--[if IE]
style type=text/css
 #NameofContainingDiv:after {
   zoom: 1; /* triggers hasLayout */
   }  /* Only IE can see inside the conditional comment
   and read this CSS rule. Don't ever use a normal HTML
   comment inside the CC or it will close prematurely. */
/style
![endif]--
Either way, the end goal is the same.
On Jan 23, 2009, at 5:15 AM, Damian Edwards wrote:
Most likely a lack of hasLayout triggers or layout context  
changes, or both.
For the coloured boxes, add overflow:hidden to the divs with  
classes catalougeMid and subscribeMid. This will force them into a  
new layout context and in turn expand the container to contain all  
elements. If you want it to apply to IE6 and IE7 only, use a  
selector hack:
* html .catalogueMid, * html .subscribeMid { overflow: hidden; } / 
* IE6 Only */
*:first-child+html .catalogueMid, *:first-child+html .subscribeMid  
{ overflow: hidden; } /* IE7 Only */

I’d have to fire up a VM to look at the IE6 issue and it’s late J
Regards,
*Damian Edwards
*Microsoft MVP https://mvp.support.microsoft.com/profile/Damian.Edwards 
 | ASP/ASP.NET

Readify | Senior Consultant
M: 0448 545 868 | E: damian.edwa...@readify.net mailto:damian.edwa...@readify.net 
 | C: damian.edwa...@readify.net sip:damian.edwa...@readify.net  
| W: www.readify.net http://www.readify.net/
*From:* li...@webstandardsgroup.org mailto:li...@webstandardsgroup.org 
 [mailto:li...@webstandardsgroup.org] *On Behalf Of *Henrik Madsen

*Sent:* Friday, 23 January 2009 19:37
*Subject:* [WSG] CSS IE6/7 - what a surprise
 HI all,
I'm hoping there's a simple solution to my two problems.
All looks fine in Mac browsers x5 and IE8b2 (according to  
netrenderer) but not in:
IE6 - Mysterious margins are appearing between the header and the  
top menu and in both coloured boxes in the right hand column of  
the main content.
IE6+7 - the coloured boxes are not 'expanding' to contain the  
content (in this case a floated image in both)
I found this CSS as an alternative to a clearing div and it seems  
to fix things in other browsers - except those IE's:

#NameofContainingDiv:after {
   clear: both;
   content: .;
   display: block;
   height: 0px;
   visibility: hidden;
}
Would anyone be able to have a look?
Here's the link:
http://www.igenerator.com.au/dev/sm09/homepage.html
Any other thoughts, comments, suggestions - always appreciated.
TIA,
Henrik Madsen
*Generator*
hen...@igenerator.com.au mailto:hen...@igenerator.com.au
www.igenerator.com.au http://www.igenerator.com.au/


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS IE6/7 - what a surprise

2009-01-23 Thread Henrik Madsen


Thanks for your replies.

Non-expanding div issue

I removed the :after stuff altogether (which initially broke the  
layout in Mac browsers)


This fixed IE7:

*:first-child+html .catalogueMid, *:first-child+html .subscribeMid  
{ overflow: hidden; }


Adding the following styles to the containing divs fixed IE6:

overflow: hidden;
zoom: 1;

And all seems fine in Mac browsers too now :s

IE6 mysterious gaps / margins

Remains unsolved. See between the header and the top menu and at the  
top of the two coloured boxes in the RH column of the main content ???


http://www.igenerator.com.au/dev/sm09/homepage.html

TIA


Henrik Madsen
Generator
hen...@igenerator.com.au
www.igenerator.com.au

On 24/01/2009, at 7:16 AM, David Dixon wrote:

Just to correct Todd's reply, the :after property isnt support by  
either IE7 or IE6 (and below), therefore you would need to adjust  
your CSS to state (assuming you're using a CSS hack, for ease of  
display):


#NameofContainingDiv {
   *zoom: 1;
   /* all your other styles for the element */
}

#NameofContainingDiv:after {
   clear: both;
   content: '.';
   display: block;
   height: 0;
   visibility: hidden;
}

David

Todd Budnikas wrote:
Damian probably gave you your answer, but I'll also say that if you  
review the original documentation from http://www.positioniseverything.net/easyclearing.html 
 for the code  you're using, you'll see that they recommend  
conditional comments to trigger hasLayout. In your case, in the  
head of your document you should add:

!--[if IE]
style type=text/css
 #NameofContainingDiv:after {
   zoom: 1; /* triggers hasLayout */
   }  /* Only IE can see inside the conditional comment
   and read this CSS rule. Don't ever use a normal HTML
   comment inside the CC or it will close prematurely. */
/style
![endif]--
Either way, the end goal is the same.
On Jan 23, 2009, at 5:15 AM, Damian Edwards wrote:
Most likely a lack of hasLayout triggers or layout context  
changes, or both.
For the coloured boxes, add overflow:hidden to the divs with  
classes catalougeMid and subscribeMid. This will force them into a  
new layout context and in turn expand the container to contain all  
elements. If you want it to apply to IE6 and IE7 only, use a  
selector hack:
* html .catalogueMid, * html .subscribeMid { overflow: hidden; } / 
* IE6 Only */
*:first-child+html .catalogueMid, *:first-child+html .subscribeMid  
{ overflow: hidden; } /* IE7 Only */

I’d have to fire up a VM to look at the IE6 issue and it’s late J
Regards,
*Damian Edwards
*Microsoft MVP https://mvp.support.microsoft.com/profile/Damian.Edwards 
 | ASP/ASP.NET

Readify | Senior Consultant
M: 0448 545 868 | E: damian.edwa...@readify.net mailto:damian.edwa...@readify.net 
 | C: damian.edwa...@readify.net sip:damian.edwa...@readify.net  
| W: www.readify.net http://www.readify.net/
*From:* li...@webstandardsgroup.org mailto:li...@webstandardsgroup.org 
 [mailto:li...@webstandardsgroup.org] *On Behalf Of *Henrik Madsen

*Sent:* Friday, 23 January 2009 19:37
*Subject:* [WSG] CSS IE6/7 - what a surprise
 HI all,
I'm hoping there's a simple solution to my two problems.
All looks fine in Mac browsers x5 and IE8b2 (according to  
netrenderer) but not in:
IE6 - Mysterious margins are appearing between the header and the  
top menu and in both coloured boxes in the right hand column of  
the main content.
IE6+7 - the coloured boxes are not 'expanding' to contain the  
content (in this case a floated image in both)
I found this CSS as an alternative to a clearing div and it seems  
to fix things in other browsers - except those IE's:

#NameofContainingDiv:after {
   clear: both;
   content: .;
   display: block;
   height: 0px;
   visibility: hidden;
}
Would anyone be able to have a look?
Here's the link:
http://www.igenerator.com.au/dev/sm09/homepage.html
Any other thoughts, comments, suggestions - always appreciated.
TIA,
Henrik Madsen
*Generator*
hen...@igenerator.com.au mailto:hen...@igenerator.com.au
www.igenerator.com.au http://www.igenerator.com.au/


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


RE: [WSG] css Help Please

2009-01-12 Thread michael.brockington
Marvin,
It is a little hard for us to help you when you do not include the
offending source code.

Regards,
Mike
 

-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Marvin Hunkin
Sent: 12 January 2009 01:37
To: wsg@webstandardsgroup.org
Subject: [WSG] css Help Please

Hi.
well vallidated my html and it passed the vallidation.
got three errors in css.
not sure why, how do i fix them.


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] css Help Please

2009-01-12 Thread David Hucklesby
On Mon, 12 Jan 2009 12:37:29 +1100, Marvin Hunkin wrote:
 Hi.
 got these three errors.
 but cannot seem to fix them.
 can you help.
 cheers Marvin.

 W3C CSS Validator results for
 file://localhost/C:\DOCS\MarvinsWebsite\styles.css (CSS level 2.1) Sorry! We 
 found the
 following errors (3)
 URI : file://localhost/C:\DOCS\MarvinsWebsite\styles.css 6 div header  
 Lexical error at
 line 5, column 2. Encountered: i (105), after :  id=Borg; width: 400px; 
 margin:
 1% auto; } 10 div site_links  Lexical error at line 9, column 2. 
 Encountered: i
 (105), after :  id=menu margin: 0 0 1% 0; }
 14 div nav  Lexical error at line 13, column 3. Encountered: i (105), after 
 : 
 id=menu_other margin: 5% 0 1% 0; }


It looks like you have mixed up some inline style data with your ID values.
An ID attribute assigns a name to an element, must start with a letter,
which can be followed by letters, digits, hyphens, underscores, colons,
and/or periods. No spaces are allowed.

Mind you, I don't know what CSS makes of IDs that have periods
and colons in them... ?

Cordially,
David
--



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] css Help Please

2009-01-12 Thread Lea de Groot

On 12/01/2009, at 11:37 AM, Marvin Hunkin wrote:


Sorry! We found the following errors (3)
URI : file://localhost/C:\DOCS\MarvinsWebsite\styles.css
6 div header  Lexical error at line 5, column 2. Encountered:  
i (105),

after :  id=Borg; width: 400px; margin: 1% auto; }



OK, you haven't quite picked up how CSS works.
I haven't seen your actual markup (the contents of the 'view source'  
of your page) but it looks like you have something like this:


div id=Borg; width: 400px; margin: 1% auto;
...
/div

where you want to have:
div id=Borg
...
/div

and in your .css file (or inside your style type=text/css ... / 
style element) put:

#Borg {
  width: 400px;
  margin: 1% auto;
}

if you want to have a 'Borg' type block appear more than once, you  
should use a 'class' rather than an 'id' - an 'id' should only appear  
once on the page while a 'class' is for repeating blocks.

This would give markup like this:
div class=Borg
...
/div

and the class would be referenced in the CSS with 'dot' notation:
.Borg {
  width: 400px;
  margin: 1% auto;
}

Hope it helps

Lea
--
Lea de Groot
Elysian Systems
Brisbane, .au


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] css Help Please

2009-01-11 Thread Marvin Hunkin
Hi.
well vallidated my html and it passed the vallidation.
got three errors in css.
not sure why, how do i fix them.
and instead of the style for text, tried using a id to refrence that in the 
style sheet, but said no duplication of the id tag, so did not want the 
style = text / say in my id class under neath one of my headings.
so how do i fix the css?
cheers Marvin.
ps: will paste below.

Hi.
got these three errors.
but cannot seem to fix them.
can you help.
cheers Marvin.

 CSS Validation Service
W3C CSS Validator results for 
file://localhost/C:\DOCS\MarvinsWebsite\styles.css (CSS level 2.1)

Jump to: Errors (3) Validated CSS
W3C CSS Validator results for 
file://localhost/C:\DOCS\MarvinsWebsite\styles.css (CSS level 2.1)
Sorry! We found the following errors (3)
URI : file://localhost/C:\DOCS\MarvinsWebsite\styles.css
6 div header  Lexical error at line 5, column 2. Encountered: i (105), 
after :  id=Borg; width: 400px; margin: 1% auto; }
10 div site_links  Lexical error at line 9, column 2. Encountered: i 
(105), after :  id=menu margin: 0 0 1% 0; }
14 div nav  Lexical error at line 13, column 3. Encountered: i (105), 
after :  id=menu_other margin: 5% 0 1% 0; }

? Top

Valid CSS information
* {
margin : 0;
padding : 0;
border : 0;
}
a:link {
font-style : normal;
font-weight : normal;
color : #0f0;
background-color : transparent;
text-decoration : none;
}
a:visited {
font-style : normal;
font-weight : normal;
color : #68aa68;
background-color : transparent;
text-decoration : none;
}
a:hover {
font-style : normal;
font-weight : normal;
color : #000;
background-color : #006800;
background-color : #0f0;
text-decoration : none;
}
a:active {
font-style : normal;
font-weight : normal;
color : #ff0;
background-color : transparent;
text-decoration : none;
}
body {
margin : 1%;
font-family : Trebuchet, Verdana, Lucida Sans, sans-serif;
font-size : 1.25em;
font-style : normal;
font-weight : normal;
text-decoration : none;
color : #fff;
background : #000 url(images/bg_stars.jpg) no-repeat center 0%;
}
div.block {
width : 700px;
margin : 5% auto;
text-align : justify;
}
#clock {
color : #007878;
}
div#lus {
font-size : 0.6em;
}
.episode {
color : #006868;
}
#feedback {
width : 38.24%;
margin : 0 auto;
border : 0 solid #700;
}
#footer {
margin : 5% 0;
text-align : center;
color : #007878;
}
h1, h2, h3 {
font-family : Trebuchet, Verdana, Lucida Sans, sans-serif;
font-weight : bold;
text-align : center;
color : #25b7f8;
}
#menulinks {
float : right;
width : 330px;
margin : 1% 5px 1% 0;
background : url(images/bg_stars.gif) repeat-y scroll;
}
p {
margin : 1% 0;
}
#star-trek {
list-style-type : none;
margin : 5% 0 1% 4%;
}
table {
text-align : left;
}
th {
font-weight : bold;
text-align : left;
}
tr {
text-align : left;
}
td {
text-align : left;
}
? Top

Home | About | Documentation | Download | Feedback | Credits

Support this tool, become a

Copyright © 1994-2008 W3C® (MIT, ERCIM, Keio), All Rights Reserved. W3C 
liability, trademark, document use and software licensing rules apply. Your 
interactions with this site are in accordance with our public and Member 
privacy statements.

E-mail: startrekc...@gmail.com
MSN: sttartrekc...@msn.com
Skype: startrekcafe
We Are The Borg! You Will Be Assimilated! Resistance Is Futile!
Star Trek Voyager Episode 68 Scorpian Part One
E-mail: startrekc...@gmail.com
MSN: sttartrekc...@msn.com
Skype: startrekcafe
We Are The Borg! You Will Be Assimilated! Resistance Is Futile!
Star Trek Voyager Episode 68 Scorpian Part One 




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] CSS invisible to IE

2008-10-30 Thread David Hucklesby
On Wed, 29 Oct 2008 09:02:21 +0500, Fuji kusaka wrote:
 Is there any way to code css (not conditional inline css), so that the CSS 
 apply online
 to FF?

I'm confused. Your subject line refers to IE, yet your question only
refers to FF.(?)

If you wish to target Firefox only, it will very much depend on which
version you intend to target. Since browsers are constantly improving
(well, most anyway) it is counter-productive to give a browser its
own CSS unless it is no longer maintained.

If, as I suspect, you need to fix a problem in FF 2, feel free to
put up an example page and ask us for a solution. I feel pretty
sure we could come up with something.

Cordially,
David
--



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS invisible to IE

2008-10-29 Thread Brett Patterson
There are conditional CSS HTML codes that can apply to FF. If you want to
use them, you can try:

!--[if N]!--link rel=stylesheet type=text/css href=the
location.css /!--![endif]--

If the above does not work, try adding an additional N in !--[if N]!--,
as in !--[if NN]!--.

On Wed, Oct 29, 2008 at 12:29 AM, Luke Hoggett [EMAIL PROTECTED]wrote:

  Hi,

 This list isn't really a help desk. For such things Google is your friend.

 Anyway, there are various methods/hacks available.  My preference is to use
 child selectors

 eg
 #container  .something {
 /* this will be used in ie6 */
 }
 #container  .something {
 /* this will be used in firefox and ie7 and safari etc*/
 }

 the order is important

 if you want ONLY FF to have the rule applied (I cannot imagine why) try
 using some of the -moz attributes that may be applicable

 Regards
 L

 Fuji kusaka wrote:

 Is there any way to code css (not conditional inline css), so that the CSS
 apply online to FF?

 --
 Fuji kusaka

 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***


 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] CSS invisible to IE

2008-10-29 Thread morten fjellman
Here is an article about hacks for Fx, Opera and IE:
http://www.nealgrosskopf.com/tech/thread.asp?pid=20

On Wed, Oct 29, 2008 at 12:41 PM, Brett Patterson 
[EMAIL PROTECTED] wrote:

 There are conditional CSS HTML codes that can apply to FF. If you want to
 use them, you can try:

 !--[if N]!--link rel=stylesheet type=text/css href=the
 location.css /!--![endif]--

 If the above does not work, try adding an additional N in !--[if N]!--,
 as in !--[if NN]!--.


 On Wed, Oct 29, 2008 at 12:29 AM, Luke Hoggett [EMAIL PROTECTED]wrote:

  Hi,

 This list isn't really a help desk. For such things Google is your friend.

 Anyway, there are various methods/hacks available.  My preference is to
 use child selectors

 eg
 #container  .something {
 /* this will be used in ie6 */
 }
 #container  .something {
 /* this will be used in firefox and ie7 and safari etc*/
 }

 the order is important

 if you want ONLY FF to have the rule applied (I cannot imagine why) try
 using some of the -moz attributes that may be applicable

 Regards
 L

 Fuji kusaka wrote:

 Is there any way to code css (not conditional inline css), so that the CSS
 apply online to FF?

 --
 Fuji kusaka

 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***


 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***



 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] CSS and printing absolute units

2008-10-28 Thread Luke Hoggett

Hi,

Try using picas (pc) or points (pt). I haven't had this problem before 
myself, but I believe that it may be caused by the fact that printers 
have no concept of what a cm or mm is.


A good description of pc and pt is at 
http://www.guistuff.com/css/css_units.html (down the page a bit)


cheers
L

nedlud wrote:

I need to write a print style sheet and have a particular element on
the page print at a specific absolute size (85mm by 35mm). I've set
the size using the mm units in the style sheet, but the element is
printing at 65mm wide.

From what I can see, mm (and cm) are well supported measurements in
different browsers, but the results I'm getting in print are not what
I need.

Does anyone have any advice on how I can get the area to print at the
right size? Or am I doomed to failure due to different users printers
probably giving different results anyway?


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***


  



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

[WSG] CSS invisible to IE

2008-10-28 Thread Fuji kusaka
Is there any way to code css (not conditional inline css), so that the CSS
apply online to FF?

-- 
Fuji kusaka


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] CSS invisible to IE

2008-10-28 Thread Luke Hoggett

Hi,

This list isn't really a help desk. For such things Google is your friend.

Anyway, there are various methods/hacks available.  My preference is to 
use child selectors


eg
#container  .something {
   /* this will be used in ie6 */
}
#container  .something {
   /* this will be used in firefox and ie7 and safari etc*/
}

the order is important

if you want ONLY FF to have the rule applied (I cannot imagine why) try 
using some of the -moz attributes that may be applicable


Regards
L

Fuji kusaka wrote:
Is there any way to code css (not conditional inline css), so that the 
CSS apply online to FF?


--
Fuji kusaka

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*** 



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

[WSG] CSS and printing absolute units

2008-10-27 Thread nedlud
I need to write a print style sheet and have a particular element on
the page print at a specific absolute size (85mm by 35mm). I've set
the size using the mm units in the style sheet, but the element is
printing at 65mm wide.

From what I can see, mm (and cm) are well supported measurements in
different browsers, but the results I'm getting in print are not what
I need.

Does anyone have any advice on how I can get the area to print at the
right size? Or am I doomed to failure due to different users printers
probably giving different results anyway?


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS font-size-adjust

2008-10-22 Thread David Hucklesby
 On Mon, 20 Oct 2008 12:36:26 -0400, Christian Montoya wrote:

 - What's the support across browsers / machines for the font-size-adjust 
 property? -
 Is adjusting the aspect value bad form? Is this as bad as letter-spacing 
 body
 copy? Would this kill sheep?
 - Has anyone done this before? Is there an ideal aspect value for screen 
 display?


 On Mon, Oct 20, 2008 at 8:41 PM, David Hucklesby [EMAIL PROTECTED] replied:

 Hi Christian,
 I believe that Firefox 3 supports it, but must admit I have not tried using 
 it.
 Interestingly I can't see the property listed in Sitepoint's Ultimate CSS
 Reference. Hmm.

 As for setting up font stacks, I found this article useful:

 http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/

 The linked PDF with samples of each type face shown side-by-side
 is a useful resource too, I think.

On Mon, 20 Oct 2008 22:44:26 -0400, Christian Montoya wrote back:

 David,

 I've been looking at that exact article, actually. It's very helpful. I guess 
 the
 biggest dilemma, currently, is that I am to come up with a consistent 
 vertical rhythm,
 but with just font-size and line-height alone, such as:

 body {
 font-size:75%;
 line-height: 1.5;
 }

 it's not enough. The difference in x-height between small fonts like 
 Calibri and
 large fonts like Verdana makes for very different results. As far as I can 
 tell, even
 using pixel or point sizes for fonts doesn't make a difference. And I'm 
 guessing that
 as far as browser compatibility goes, there's nothing that does. Is that 
 right?


Interesting. I have been doing some extensive tests to get that 
vertical rhythm to work cross-browser. I had not considered the
differing x-height between fonts. I'll make some more tests and report
back.

Meantime, I found the most consistent results using 100% base font
in IE, and 16 pixels for the rest. !00% base just does not work for all.
After that, I found I can use percents or EMs, calculated from nominal
pixels, for most everything-- as long as you round *any* fraction up 
to the next higher .01em for Safari.

Note: some browsers only apply whole percents, so more precision
may upset things.

Here are my results so far:

Nominal Points Size Pixels/ Percent
6pt nonpareil   8px 50%
7pt minion  9px 56.5%
8pt brevier 11px69%
9pt bourgeois   12px75%
10pt long primer13px82%
11pt small pica 15px94%
12pt pica   16px100%
14pt english19px119%
16pt columbian  21px132%
18pt great primer   24px150%
21pt double small pica  28px175%
24pt double pica32px200%
36pt double great primer48px300%

(Hope this isn't too muddled.)

P.S. - I use a line-height in EMs, based off the base, for body text
that's close to 100% to get equal vertical spacing. But I do need
to test various font faces, as you suggest. Also, DPI other than 96.

Cordially,
David
--




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS editors

2008-10-21 Thread tee


On Oct 20, 2008, at 1:37 PM, [EMAIL PROTECTED] wrote:


If you want to save money and have an all round free open source  
editor that does CSS, PHP, javascript, and other major languages I  
would suggest notepad++.


Been using it since it was first available and haven't looked at  
anything else. Mind you, apart from Flash * GIMP, I use notepad++  
for all my web design.


This probably is off topic so I apology first, however I think it  
worths mentioning especially for the original poster to note when  
deciding which one to purchase.
I got Textmate and CSSEdit long time ago and had purchased Coda just  
some 6 months ago, the very reason for it is that I have been working  
mainly on Magento projects, and because the software runs very slow on  
local server so I have been working the files directly from the web  
server. With Coda, I can access entire remote root directory from the  
leftside of the panel, and the connection is good - 6 months, not a  
single timeout. I can only open remove file one at a time for  
Textmate, and my FTP client kept giving me timeout error.


In short, Coda is an editor with FTP , but I just love CSSEdit so much  
I continue using it with Coda. Coda comes with HTML, CSS, Javascript  
and PHP reference books so this is something very good too. You an  
even say it's a super light version of Dreamweaver.


tee


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS font-size-adjust

2008-10-21 Thread Rob Schumann
Hi Christian,

Christian Montoya wrote on 20-10-2008:

  http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/

Back in September 2006 I wrote a piece that reached some similar
conclusions to that above
http://www.webspaceworks.com/resources/fonts-web-typography/60/

At the time the use of font-size-adjust was an impractical solution due
to it's very poor support among browsers... not even consistently across
all platforms for firefox. I don't think much has changed in that
regard, but would have to check to be sure.

The best solution therefore was to use available resources regarding
font availability and to plan typography around that, looking for fonts
of similar aspect ratio with which to build your family (or stack, call
it what you will).

I've also setup tables of aspect ratios and x-widths for some common
fonts, since aspect ratios don't give necessarily the complete picture
(verdana and tahoma share the same aspect ratio, but differ
significantly in x-width).

http://www.webspaceworks.com/resources/fonts-web-typography/43/

Hope these may be of some use...

Cheers


Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS font-size-adjust

2008-10-21 Thread Christian Montoya
On Tue, Oct 21, 2008 at 7:14 AM, Rob Schumann
[EMAIL PROTECTED] wrote:
 Hi Christian,

 Christian Montoya wrote on 20-10-2008:

   http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/

 Back in September 2006 I wrote a piece that reached some similar
 conclusions to that above
 http://www.webspaceworks.com/resources/fonts-web-typography/60/

 At the time the use of font-size-adjust was an impractical solution due
 to it's very poor support among browsers... not even consistently across
 all platforms for firefox. I don't think much has changed in that
 regard, but would have to check to be sure.

 The best solution therefore was to use available resources regarding
 font availability and to plan typography around that, looking for fonts
 of similar aspect ratio with which to build your family (or stack, call
 it what you will).

 I've also setup tables of aspect ratios and x-widths for some common
 fonts, since aspect ratios don't give necessarily the complete picture
 (verdana and tahoma share the same aspect ratio, but differ
 significantly in x-width).

 http://www.webspaceworks.com/resources/fonts-web-typography/43/

Thanks Rob, I think that just about answers all my questions. Would it
be possible for you to update your tables with the Vista fonts?



-- 
--
Christian Montoya
christianmontoya.net


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS font-size-adjust

2008-10-21 Thread Felix Miata
On 2008/10/21 18:14 (GMT+0700) Rob Schumann composed:

 Christian Montoya wrote on 20-10-2008:

   http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/

 Back in September 2006 I wrote a piece that reached some similar
 conclusions to that above
 http://www.webspaceworks.com/resources/fonts-web-typography/60/

Neither of those take into account the recent and current states of FOSS
fonts. It would be nice to see yours updated to take into account:

1-DejaVu is a continually developed and better hinted superset of no longer
developed Bitstream Vera that has replaced Vera in most Linux distros for
several years now. An installation of the OpenOffice.org 3.0 w/ JRE package
on WinXP results in 21 DejaVu*ttf files being added to \WINDOWS\Fonts.

2-The Liberation font suite was developed to function as an alternative to
installing  the Microsoft Core Web Fonts package on Linux. Its single metric
equivalent serif (Liberation Serif=Times New Roman), sans-serif (Liberation
Sans=Arial/Helvetica) and monospace (Liberation Mono=Lucida Console/Courier
New) components are available either by default or as an option with
installation of most recent and current Linux distros.

3-Linux fontconfig provides a font stack for fallback. For purposes of this
thread, I've made available three examples from major distros:
Fedora 10   http://fm.no-ip.com/tmp/Linux/45-latin.conf-fc10
Mandriva 2009   http://fm.no-ip.com/tmp/Linux/45-latin.conf-mdv2009
openSUSE 11.1   http://fm.no-ip.com/tmp/Linux/suse-post-user.conf

We have been told in a (IIRC) Novell Bugzilla comment by the fonts team
leader Mike Fabian that openSUSE's order within its alias file was set
primarily dependent on font quality, particularly in the areas of charset
coverage, byte code and hinting. Contrast that to the other two, which leave
x-height pretty much a non-issue, seen by the separation between DejaVu Sans
and Verdana in both files.
-- 
Everyone should be quick to listen, slow to speak, and
slow to become angry.  James 1:19 NIV

 Team OS/2 ** Reg. Linux User #211409

Felix Miata  ***  http://fm.no-ip.com/


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS font-size-adjust

2008-10-21 Thread Rob Schumann
Hi Christian,

Christian Montoya wrote on 21-10-2008:
  
  Thanks Rob, I think that just about answers all my questions. Would
  it be possible for you to update your tables with the Vista fonts?
  
I've updated the aspect-ratio/x-widths article to include the 6 'C'
fonts of Vista

http://www.webspaceworks.com/resources/fonts-web-typography/43/

Updates for other fonts, and to bring font availability tables
up-to-date will follow later.

Cheers


Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS font-size-adjust

2008-10-21 Thread Felix Miata
On 2008/10/21 23:40 (GMT+0700) Rob Schumann composed:

 I've updated the aspect-ratio/x-widths article to include the 6 'C'
 fonts of Vista

 http://www.webspaceworks.com/resources/fonts-web-typography/43/

At some point you might want to mention that, unlike most monospace fonts,
which match each other in width at most or all sizes, Consolas in many common
sizes renders considerably narrower, as if called in the next smaller size.
You should be able to see examples on
http://fm.no-ip.com/auth/Font/fonts-face-samplesM.html

 Updates for other fonts, and to bring font availability tables
 up-to-date will follow later.

Looking forward to it. :-)
-- 
Everyone should be quick to listen, slow to speak, and
slow to become angry.  James 1:19 NIV

 Team OS/2 ** Reg. Linux User #211409

Felix Miata  ***  http://fm.no-ip.com/


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS editors

2008-10-20 Thread Gareth Senior
 
I use TextMate. Extensible for all kinds of use.
It has a good CSS bundle.

It¹s rubbish for printing though - I use textwrangler for printing out code.



On 20/10/2008 11:09, Simon [EMAIL PROTECTED] wrote:

 Last time I used a Mac I edited with Text Wrangler
  
 http://www.barebones.com/products/textwrangler/download.html
  
 It did the job
  
 
 
 From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
 Behalf Of Gicela Morales
 Sent: 20 October 2008 10:51
 To: wsg@webstandardsgroup.org
 Subject: [WSG] CSS editors
  
 
 Hi Everyone,
 
  
 
 I've just migrated form PC to a new macbook  :-) but was wondering about the
 best xhtml/css editors for macs around that people can recommend?
 
  
 
 I can see that BBEdit is still around ( I used to use this back in the 90's)
 and CSSedit seem to have some good reviews. Any preferences?
 
  
 
 Kind regards,
 
 Gicela
 
  
 
 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***
 
 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***



All correspondence, attachments and agreements remain strictly subject to fully 
executed contract. (c) GCap Media plc 2008. All rights remain reserved. This 
e-mail (and any attachments) contains information which may be confidential, 
subject to intellectual property protection and may be legally privileged and 
protected from disclosure and unauthorised use. It is intended solely for the 
use of the individual(s) or entity to whom it is addressed and others 
specifically authorised to receive it. If you are not the intended recipient of 
this e-mail or any parts of it please telephone 020 7054 8000 immediately upon 
receipt. No other person is authorised to copy, adapt, forward, disclose, 
distribute or retain this e-mail in any form without prior specific permission 
in writing from an authorised representative of GCap Media plc. We will not 
accept liability for any claims arising as a result of the use of the internet 
to transmit information by or to GCap Media plc.

GCap Media plc. Registered address: 30 Leicester Square, London WC2H 7LA.  
Registered in England  Wales with No. 923454


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***


Re: [WSG] CSS editors

2008-10-20 Thread Ollie
I use textmate, http://macromates.com/ as it has really good plug-in
support, I have heard good things about Coda though.

Ollie

On Mon, Oct 20, 2008 at 10:51 AM, Gicela Morales
[EMAIL PROTECTED]wrote:

 Hi Everyone,
 I've just migrated form PC to a new macbook  :-) but was wondering about
 the best xhtml/css editors for macs around that people can recommend?

 I can see that BBEdit is still around ( I used to use this back in the
 90's) and CSSedit seem to have some good reviews. Any preferences?

 Kind regards,
 Gicela


 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***




-- 
Ollie Kavanagh
---
OK design
Phone: 07701083386
E-Mail: [EMAIL PROTECTED]
msn: [EMAIL PROTECTED]
aim: olliekav
www.olliekav.com
---


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

RE: [WSG] CSS editors

2008-10-20 Thread Simon
Last time I used a Mac I edited with Text Wrangler

 

http://www.barebones.com/products/textwrangler/download.html 

 

It did the job

 

  _  

From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Gicela Morales
Sent: 20 October 2008 10:51
To: wsg@webstandardsgroup.org
Subject: [WSG] CSS editors

 

Hi Everyone,

 

I've just migrated form PC to a new macbook  :-) but was wondering about the
best xhtml/css editors for macs around that people can recommend?

 

I can see that BBEdit is still around ( I used to use this back in the 90's)
and CSSedit seem to have some good reviews. Any preferences?

 

Kind regards,

Gicela

 


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] CSS editors

2008-10-20 Thread James Jeffery
I have both BBEdit and TextMate.

I use TextMate alot because it's a nice and simple text editor. Project
creation is easy also, you just drag in project folders.

I like BBEdit when I am doing Java, C/C++ and general programming, but
depending on the task I will use XCode aswell.

If it's just HTML, CSS, JavaScript, PHP/Python/Ruby then I'd go with
TextMate: http://macromates.com/

Good move on the Mac though.

James


On Mon, Oct 20, 2008 at 10:51 AM, Gicela Morales
[EMAIL PROTECTED]wrote:

 Hi Everyone,
 I've just migrated form PC to a new macbook  :-) but was wondering about
 the best xhtml/css editors for macs around that people can recommend?

 I can see that BBEdit is still around ( I used to use this back in the
 90's) and CSSedit seem to have some good reviews. Any preferences?

 Kind regards,
 Gicela


 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: SPAM-LOW: [WSG] CSS editors

2008-10-20 Thread kevin mcmonagle

there is a free version of bbedit called textwrangler if you can hardcode.


Gicela Morales wrote:

Hi Everyone,

I've just migrated form PC to a new macbook  :-) but was wondering 
about the best xhtml/css editors for macs around that people can 
recommend?


I can see that BBEdit is still around ( I used to use this back in the 
90's) and CSSedit seem to have some good reviews. Any preferences?


Kind regards,
Gicela


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*** 





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS editors

2008-10-20 Thread Muswardi
I'm using CODA too... I think it's a great tools since when still
using PC, I'm get used to EditPlus.

Rgds,

Muswardi

On Mon, Oct 20, 2008 at 5:09 PM, Simon [EMAIL PROTECTED] wrote:
 Last time I used a Mac I edited with Text Wrangler



 http://www.barebones.com/products/textwrangler/download.html



 It did the job



 

 From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
 Behalf Of Gicela Morales
 Sent: 20 October 2008 10:51
 To: wsg@webstandardsgroup.org
 Subject: [WSG] CSS editors



 Hi Everyone,



 I've just migrated form PC to a new macbook  :-) but was wondering about the
 best xhtml/css editors for macs around that people can recommend?



 I can see that BBEdit is still around ( I used to use this back in the 90's)
 and CSSedit seem to have some good reviews. Any preferences?



 Kind regards,

 Gicela



 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***

 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] CSS editors

2008-10-20 Thread Gicela Morales
Thanks everyone.  I like the idea of TextMate and TextWrangler!
Gicela :-)

2008/10/20 James Jeffery [EMAIL PROTECTED]

 I have both BBEdit and TextMate.

 I use TextMate alot because it's a nice and simple text editor. Project
 creation is easy also, you just drag in project folders.

 I like BBEdit when I am doing Java, C/C++ and general programming, but
 depending on the task I will use XCode aswell.

 If it's just HTML, CSS, JavaScript, PHP/Python/Ruby then I'd go with
 TextMate: http://macromates.com/

 Good move on the Mac though.

 James


 On Mon, Oct 20, 2008 at 10:51 AM, Gicela Morales [EMAIL PROTECTED]
  wrote:

 Hi Everyone,
 I've just migrated form PC to a new macbook  :-) but was wondering about
 the best xhtml/css editors for macs around that people can recommend?

 I can see that BBEdit is still around ( I used to use this back in the
 90's) and CSSedit seem to have some good reviews. Any preferences?

 Kind regards,
 Gicela


 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***



 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] CSS editors

2008-10-20 Thread designer
Does no-one use Topstyle?

http://www.newsgator.com/Individuals/TopStyle/Default.aspx

Bob

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***


Re: [WSG] CSS editors

2008-10-20 Thread Nancy Johnson
I'm Dreamweaver and hand write code.   Years ago I used to use BBedit
and loved it, however, I also moved from mac to pc years ago.  I'm
sorry that Barebones didn't develop versions for the pc.  The
companies I tend to work for are PC only

Nancy

On Mon, Oct 20, 2008 at 6:52 AM, designer
[EMAIL PROTECTED] wrote:
 Does no-one use Topstyle?

 http://www.newsgator.com/Individuals/TopStyle/Default.aspx

 Bob
 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: [EMAIL PROTECTED]
 ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



[WSG] CSS editors

2008-10-20 Thread Gicela Morales
Hi Everyone,
I've just migrated form PC to a new macbook  :-) but was wondering about the
best xhtml/css editors for macs around that people can recommend?

I can see that BBEdit is still around ( I used to use this back in the 90's)
and CSSedit seem to have some good reviews. Any preferences?

Kind regards,
Gicela


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

<    1   2   3   4   5   6   7   8   9   10   >