Re: [WSG] Accessible websites (was: accessible free web hosting account)
I'll just address one you raised Jens. Google does not currently parse external Javascript files. So unless Fairfax uses simple inline Javascript, and exposes spiderable URLS, that's probably good enough for most of us to use progressive enhancement methodology . Ask Lucas. When he gets back from SG Chris http://www.cogentis.com.au Is there any other strong arguments for making pages available, without javascript enabled? I'd like to know too. On the Sydney Morning Herald in June less than 0.5% of users had JS disabled. Maybe we should drop that support? Anyone willing to share their numbers/reasons? *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
[WSG] working with line-height
Hi list, I frequently have to work with pixel-perfect design, and I'm always having trouble with line-height in particular. Please take a look at this example: http://www.hellobenlau.net/wsg/index.html I'm wondering if there was a way to top align the text to its line-height. So say, with text size 20px, could the top of the 'T' be aligned to the top of the pink box? How does the 'gap' above and below the text gets calculated? Thanks Ben [] *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] working with line-height
Hi Ben, It seems that the short answer to your question is a base line-height of 0.8 (yup, unitless). My guess would have been the value 1 but I don't know enough about browser default styles to say why 0.8 seems to work. I've only checked this using IE8 and Firefox 3.5 using the developer tool bar, so there's a fair chance I'm talking crap, but it's probably an avenue worth investigating. As with so many things CSS my knowledge comes directly from Eric Meyer, so I'll link his site. http://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/ Cheers, Ant From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Ben Lau Sent: 01 July 2009 16:20 To: wsg@webstandardsgroup.org Subject: [WSG] working with line-height Hi list, I frequently have to work with pixel-perfect design, and I'm always having trouble with line-height in particular. Please take a look at this example: http://www.hellobenlau.net/wsg/index.html I'm wondering if there was a way to top align the text to its line-height. So say, with text size 20px, could the top of the 'T' be aligned to the top of the pink box? How does the 'gap' above and below the text gets calculated? Thanks Ben [] *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** IMPORTANT NOTICE: This email contains proprietary information, some or all of which may be legally privileged. It is for the intended recipient only. If an addressing or transmission error has misdirected this email, please notify the author by replying to this email. If you are not the intended recipient you must not use, disclose, distribute, copy, print or rely on this email. In addition you must erase all information contained in this email immediately after notifying the author. No liability is accepted for viruses and it is your responsibility to scan attachments (if any). Unless related to the business of the firm, the opinions expressed within this email are the opinions of the sender and do not necessarily constitute those of Conscia Enterprise Systems Ltd, whose registered address is 280 St Vincent Street, Glasgow, G2 5RL, United Kingdom. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] working with line-height
On Thu, 2 Jul 2009, Ben Lau wrote: I frequently have to work with pixel-perfect design, There is no such thing. and I'm always having trouble with line-height in particular. Please take a look at this example: http://www.hellobenlau.net/wsg/index.html Where you state, This text size is 11px. it is not; it is 18px in my browser. I'm wondering if there was a way to top align the text to its line-height. So say, with text size 20px, could the top of the 'T' be aligned to the top of the pink box? Align it to the top of its container. How does the 'gap' above and below the text gets calculated? What do the W3C specs say? If they don't say, then browsers can use whatever formula they like. -- Chris F.A. Johnson http://cfaj.freeshell.org === 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] working with line-height
Hey Ben, That additional space you see above the letters is set aside for diacritical marks (umlaut etc). If you replace the content within the 23 pixel paragraph with the content below, you should see that all the special character marks sit above the letters and fill this empty space. Try adding this to the 23 pixel paragraph: Ugrave;Yuml;Ouml;Otilde;Ocirc;Oacute;Ograve;Ntilde;Iuml;Icirc; Iacute;Igrave;Euml;Ecirc;Egrave;Aring;Auml;Atilde;Agrave; How would you remove this space? The mind boggles. You are trying to mess with anonymous inline boxes. The actual inline boxes that wrap around text. http://www.w3.org/TR/CSS2/visuren.html#anonymous I do not think that reducing the line height will resolve the issue as this will more than likely close the space BETWEEN lines - not reduce the height of the anonymous inline boxes themselves. Thanks Russ On 02/07/2009, at 1:20 AM, Ben Lau wrote: Hi list, I frequently have to work with pixel-perfect design, and I'm always having trouble with line-height in particular. Please take a look at this example: http://www.hellobenlau.net/wsg/index.html I'm wondering if there was a way to top align the text to its line- height. So say, with text size 20px, could the top of the 'T' be aligned to the top of the pink box? How does the 'gap' above and below the text gets calculated? Thanks Ben [] *** 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] Accessible websites (was: accessible free web hosting account)
At Yahoo! we build our sites to work without JS and then add progressive enhancement. I don't have the stats in front of me, but we find a much larger number of users without JS. Take a look at this page: http://finance.yahoo.com/news With JS enabled and disabled you'll see all of the customization functionality works. The personalization features were built by Dirk Ginader who also made this presentation on why and how you should build sites for everyone. http://www.slideshare.net/ginader/the-5-layers-of-web-accessibility Ted DRAKE -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Chris Dimmock Sent: Wednesday, July 01, 2009 3:23 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Accessible websites (was: accessible free web hosting account) I'll just address one you raised Jens. Google does not currently parse external Javascript files. So unless Fairfax uses simple inline Javascript, and exposes spiderable URLS, that's probably good enough for most of us to use progressive enhancement methodology . Ask Lucas. When he gets back from SG Chris http://www.cogentis.com.au Is there any other strong arguments for making pages available, without javascript enabled? I'd like to know too. On the Sydney Morning Herald in June less than 0.5% of users had JS disabled. Maybe we should drop that support? Anyone willing to share their numbers/reasons? *** 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] working with line-height
Ben,
On the spacing, the spaces you're fighting with are a combination of
line-height, margin and padding.
Each browser will implement their own defaults, so resetting the
defaults with a reset stylesheet has become a popular technique.
For example, if you apply a line like this to your page:
* {
margin: 0 !important;
padding: 0 !important;
}
You should see everything collapse.
Follow that with a:
line-height: XXpx;
and you should see the results you're looking for.
Joseph R. B. Taylor
/Designer / Developer/
--
Sites by Joe, LLC
/Clean, Simple and Elegant Web Design/
Phone: (609) 335-3076
Web: http://sitesbyjoe.com
Email: j...@sitesbyjoe.com
On 7/1/09 11:57 AM, Chris F.A. Johnson wrote:
On Thu, 2 Jul 2009, Ben Lau wrote:
I frequently have to work with pixel-perfect design,
There is no such thing.
and I'm always having trouble with line-height in particular. Please
take a look at this example:
http://www.hellobenlau.net/wsg/index.html
Where you state, This text size is 11px. it is not; it is 18px
in my browser.
I'm wondering if there was a way to top align the text to its
line-height.
So say, with text size 20px, could the top of the 'T' be aligned to
the top
of the pink box?
Align it to the top of its container.
How does the 'gap' above and below the text gets calculated?
What do the W3C specs say? If they don't say, then browsers can
use whatever formula they like.
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] Accessible websites
In the big picture, many things will use your website that won't use javascript. Like a search engine spider. Or a crappy cell phone. At the very least make sure your basic site functions don't rely on javascript to work. Same thing with images. The arguments/links below from Ted are valuble if you want to look deeper. Joseph R. B. Taylor /Designer / Developer/ -- Sites by Joe, LLC /Clean, Simple and Elegant Web Design/ Phone: (609) 335-3076 Web: http://sitesbyjoe.com Email: j...@sitesbyjoe.com On 7/1/09 12:39 PM, Ted Drake wrote: At Yahoo! we build our sites to work without JS and then add progressive enhancement. I don't have the stats in front of me, but we find a much larger number of users without JS. Take a look at this page: http://finance.yahoo.com/news With JS enabled and disabled you'll see all of the customization functionality works. The personalization features were built by Dirk Ginader who also made this presentation on why and how you should build sites for everyone. http://www.slideshare.net/ginader/the-5-layers-of-web-accessibility Ted DRAKE -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Chris Dimmock Sent: Wednesday, July 01, 2009 3:23 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Accessible websites (was: accessible free web hosting account) I'll just address one you raised Jens. Google does not currently parse external Javascript files. So unless Fairfax uses simple inline Javascript, and exposes spiderable URLS, that's probably good enough for most of us to use progressive enhancement methodology . Ask Lucas. When he gets back from SG Chris http://www.cogentis.com.au Is there any other strong arguments for making pages available, without javascript enabled? I'd like to know too. On the Sydney Morning Herald in June less than 0.5% of users had JS disabled. Maybe we should drop that support? Anyone willing to share their numbers/reasons? *** 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 ***
[Spam] :RE: [WSG] Accessible websites (was: accessible free web hosting account)
If you are unsure that web accessibility should play a role, take this test. In a group of people have everyone stand up. Those who are unable to stand may remain seated. Now pose these three requests, in order: 1) If you are wear glasses, contacts and/or have had corrective eye surgery, please sit down. 2) Of those who remain standing, if you know for a fact you are color-blind, please sit down. 3) Of those who now remain standing, everyone aged 35-40 or more, please sit down. Those who are left standing have little to no immediate need for web accessibility, but they will in time. Of those who sat down, while many (most?) may not meet a legal definition as being disabled, for all intents and purposes they are web disabled and are in immediate need of web accessibility. I average 80 percent or more end up sitting down every time I perform this test. The short three question test is not scientific. It is not technically accurate. But as an illustrative tool to raise accessibility awareness, it is 100 percent effective. Here in the USA, 20 percent of the population is disabled. That's sixty million people. Many of these disabilities have no connection with web accessibility. If you believe web accessibility provides no revenue return for a site owner, think again. Those who possess the wealth and spend the money are those who are sitting down. They are the ones that vote. It only took one blind person in California to bring down target.com, using a law not written to address web accessibility. Accessibility is not about the law. It's about doing the right thing. And when it comes to web accessibility, everyone at some point will be a disabled web user. Dennis Lapcewich US Forest Service Webmaster DRM Civil Rights POC Pacific Northwest Region - Vancouver, WA 360.891.5024 - Voice | 360.891.5045 - Fax dlapcew...@fs.fed.us People who say it cannot be done should not interrupt those who are doing it. -- George Bernard Shaw ??where conflicting interests must be reconciled, the question will always be decided from the standpoint of the greatest good of the greatest number in the long run.? --Gifford Pinchot, Chief Forester, 1905 *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [Spam] :RE: [WSG] Accessible websites (was: accessible free web hosting account)
Web accessibility is being more properly handled by browser creators using magnification functionality, which more effectively provides a better, more satisfying user experience because images, as well as text, can be magnified. While previous magnification functionality has required users to scroll horizontally, that, too, is being addressed by browser creators. So designers can be a good bridge to a better future for users, ultimately the browser creators will provide better solutions than we can...and I'm a visually impaired user who does not want to have a better view of only the text, but the entire layout as designed. Rick On Wed, Jul 1, 2009 at 5:33 PM, Dennis Lapcewich dlapcew...@fs.fed.uswrote: If you are unsure that web accessibility should play a role, take this test. In a group of people have everyone stand up. Those who are unable to stand may remain seated. Now pose these three requests, in order: 1) If you are wear glasses, contacts and/or have had corrective eye surgery, please sit down. 2) Of those who remain standing, if you know for a fact you are color-blind, please sit down. 3) Of those who now remain standing, everyone aged 35-40 or more, please sit down. Those who are left standing have little to no immediate need for web accessibility, but they will in time. Of those who sat down, while many (most?) may not meet a legal definition as being disabled, for all intents and purposes they are web disabled and are in immediate need of web accessibility. I average 80 percent or more end up sitting down every time I perform this test. The short three question test is not scientific. It is not technically accurate. But as an illustrative tool to raise accessibility awareness, it is 100 percent effective. Here in the USA, 20 percent of the population is disabled. That's sixty million people. Many of these disabilities have no connection with web accessibility. If you believe web accessibility provides no revenue return for a site owner, think again. Those who possess the wealth and spend the money are those who are sitting down. They are the ones that vote. It only took one blind person in California to bring down target.com, using a law not written to address web accessibility. Accessibility is not about the law. It's about doing the right thing. And when it comes to web accessibility, everyone at some point will be a disabled web user. Dennis Lapcewich US Forest Service Webmaster DRM Civil Rights POC Pacific Northwest Region - Vancouver, WA 360.891.5024 - Voice | 360.891.5045 - Fax dlapcew...@fs.fed.us People who say it cannot be done should not interrupt those who are doing it. -- George Bernard Shaw “…where conflicting interests must be reconciled, the question will always be decided from the standpoint of the greatest good of the greatest number in the long run.” --Gifford Pinchot, Chief Forester, 1905 *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** -- -- Ninety percent of the politicians give the other ten percent a bad reputation. Henry Kissinger *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] working with line-height
Joseph Taylor wrote re: http://www.hellobenlau.net/wsg/index.html
Ben,
On the spacing, the spaces you're fighting with are a combination of
line-height, margin and padding.
Each browser will implement their own defaults, so resetting the
defaults with a reset stylesheet has become a popular technique.
For example, if you apply a line like this to your page:
* { margin: 0 !important; padding: 0 !important; }
You should see everything collapse.
Follow that with a:
line-height: XXpx;
and you should see the results you're looking for.
Begging your pardon, but I think this solution may lead to new problems.
Using that margin and padding reset is likely to stop some form
elements working in older browsers. Better to define the margins and
padding you want on the elements that need them, in my opinion.
Specifying the line-height in pixels works differently from browser to
browser, some browsers increasing the line-height along with text size,
while others retain the same pixel height when text is enlarged.
I hesitate to post this, as I wish I had something more constructive to
contribute. Sadly, I don't know how to achieve what Ben asks.
Cordially,
David
--
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [Spam] :RE: [WSG] Accessible websites (was: accessible free web hosting account)
2009/7/2 Dennis Lapcewich dlapcew...@fs.fed.us: If you are unsure that web accessibility should play a role, take this test. In a group of people have everyone stand up. Those who are unable to stand may remain seated. Now pose these three requests, in order: 1) If you are wear glasses, contacts and/or have had corrective eye surgery, please sit down. 2) Of those who remain standing, if you know for a fact you are color-blind, please sit down. 3) Of those who now remain standing, everyone aged 35-40 or more, please sit down. Those who are left standing have little to no immediate need for web accessibility, but they will in time. Of those who sat down, while many (most?) may not meet a legal definition as being disabled, for all intents and purposes they are web disabled and are in immediate need of web accessibility. While I agree with your general sentiment, I have to say I find the assertion that all people aged 35-40 or more are for all intents and purposes [...] web disabled and [...] in immediate need of web accessibility questionable, to say the least. I'd be careful of overstating the case like this, as it can undermine the whole argument. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] working with line-height
Ben Lau wrote: http://www.hellobenlau.net/wsg/index.html I'm wondering if there was a way to top align the text to its line-height. So say, with text size 20px, could the top of the 'T' be aligned to the top of the pink box? Is this what you want? http://www.gunlaug.no/tos/alien/bl/test_09_0702.html Note that you can't really get pixel perfect alignment across browser-land, as there will always be some em-to-pixel rounding deviation. Georg -- http://www.gunlaug.no *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] working with line-height
David,
What form elements / what browsers do you mean? I'm curious as I
haven't seen anyone make comments against reset stylesheets as of yet.
Joseph R. B. Taylor
/Designer / Developer/
--
Sites by Joe, LLC
/Clean, Simple and Elegant Web Design/
Phone: (609) 335-3076
Web: http://sitesbyjoe.com
Email: j...@sitesbyjoe.com
On 7/1/09 7:49 PM, David Hucklesby wrote:
Joseph Taylor wrote re: http://www.hellobenlau.net/wsg/index.html
Ben,
On the spacing, the spaces you're fighting with are a combination of
line-height, margin and padding.
Each browser will implement their own defaults, so resetting the
defaults with a reset stylesheet has become a popular technique.
For example, if you apply a line like this to your page:
* { margin: 0 !important; padding: 0 !important; }
You should see everything collapse.
Follow that with a:
line-height: XXpx;
and you should see the results you're looking for.
Begging your pardon, but I think this solution may lead to new problems.
Using that margin and padding reset is likely to stop some form
elements working in older browsers. Better to define the margins and
padding you want on the elements that need them, in my opinion.
Specifying the line-height in pixels works differently from browser to
browser, some browsers increasing the line-height along with text size,
while others retain the same pixel height when text is enlarged.
I hesitate to post this, as I wish I had something more constructive to
contribute. Sadly, I don't know how to achieve what Ben asks.
Cordially,
David
--
***
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] working with line-height
Hi Georg, Close, but this poses bit of layout issue surrounding the text. This is what I'm trying to achieve: http://hellobenlau.net/wsg/eg.gif So there'll be a div with padding top and bottom of 20px, and with text inside. If I do: div style=padding:20px 0 psome text/p /div The gap would include both the padding and the anonymous inline boxes (thanks Russ), which works out to be 20px. Could there perhaps be a way to calculate the amount of white-space for these anonymous inline boxes? I'm not trying to achieve exact look across all browsers, I understand it's impossible. But I'm trying to achieve to make it look like the design at least.. in 1 browser (just so my designers are happy). Thanks. Ben On Thu, Jul 2, 2009 at 10:34 AM, Gunlaug Sørtun gunla...@c2i.net wrote: Ben Lau wrote: http://www.hellobenlau.net/wsg/index.html I'm wondering if there was a way to top align the text to its line-height. So say, with text size 20px, could the top of the 'T' be aligned to the top of the pink box? Is this what you want? http://www.gunlaug.no/tos/alien/bl/test_09_0702.html Note that you can't really get pixel perfect alignment across browser-land, as there will always be some em-to-pixel rounding deviation. Georg -- http://www.gunlaug.no *** 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] working with line-height
Joseph Taylor wrote:
David,
What form elements / what browsers do you mean? I'm curious as I
haven't seen
anyone make comments against reset stylesheets as of yet.
To reiterate David's point, I sent the below earlier (but due to server
updates many months ago my *true* email was changed, so it never made
it).
**
Ben,
On the spacing, the spaces you're fighting with are a combination of
line-height, margin and padding.
Each browser will implement their own defaults, so resetting the
defaults with a reset stylesheet has become a popular technique.
Agreed, and there are various implementations out there that do the job,
such as:
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
although I personally find that to be slight overkill.
For example, if you apply a line like this to your page:
* {
margin: 0 !important;
padding: 0 !important;
}
You should see everything collapse.
Follow that with a:
line-height: XXpx;
and you should see the results you're looking for.
That's a very big negative, given the use of !important on the global
reset (* {}) such an approach cannot be recommended. Actually, unless
I'm mistaken (and it is possible), the global reset has some issues with
forms and various other elements that once set cannot be undone, and has
since fallen by the way. There are other methods of achieving similar
results however (see Eric Meyer's reset link above). At the very least,
if the global reset is your preferred choice, do *not* use !important
with it or all your margins and paddings are going to disappear on all
elements, and you are in for a world of hurt. Maybe you're a masochist
and that isn't such a bad thing :-P.
HTH
Mark
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] working with line-height
To clarify what I do in the real world:
I use a reset stylesheet then reapply my own defaults so my own form
elements appear fine.
You're correct about the !important declaration - that shouldn't be
there for the resets. My mistake.
Joseph R. B. Taylor
/Designer / Developer/
--
Sites by Joe, LLC
/Clean, Simple and Elegant Web Design/
Phone: (609) 335-3076
Web: http://sitesbyjoe.com
Email: j...@sitesbyjoe.com
On 7/1/09 10:31 PM, Mark Henderson wrote:
Joseph Taylor wrote:
David,
What form elements / what browsers do you mean? I'm curious as I
haven't seen
anyone make comments against reset stylesheets as of yet.
To reiterate David's point, I sent the below earlier (but due to server
updates many months ago my *true* email was changed, so it never made
it).
**
Ben,
On the spacing, the spaces you're fighting with are a combination of
line-height, margin and padding.
Each browser will implement their own defaults, so resetting the
defaults with a reset stylesheet has become a popular technique.
Agreed, and there are various implementations out there that do the job,
such as:
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
although I personally find that to be slight overkill.
For example, if you apply a line like this to your page:
* {
margin: 0 !important;
padding: 0 !important;
}
You should see everything collapse.
Follow that with a:
line-height: XXpx;
and you should see the results you're looking for.
That's a very big negative, given the use of !important on the global
reset (* {}) such an approach cannot be recommended. Actually, unless
I'm mistaken (and it is possible), the global reset has some issues with
forms and various other elements that once set cannot be undone, and has
since fallen by the way. There are other methods of achieving similar
results however (see Eric Meyer's reset link above). At the very least,
if the global reset is your preferred choice, do *not* use !important
with it or all your margins and paddings are going to disappear on all
elements, and you are in for a world of hurt. Maybe you're a masochist
and that isn't such a bad thing :-P.
HTH
Mark
***
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] working with line-height
Ben Lau wrote: This is what I'm trying to achieve: http://hellobenlau.net/wsg/eg.gif So there'll be a div with padding top and bottom of 20px, and with text inside. If I do: div style=padding:20px 0 psome text/p /div The gap would include both the padding and the anonymous inline boxes (thanks Russ), which works out to be 20px. Could there perhaps be a way to calculate the amount of white-space for these anonymous inline boxes? Set the line-height in em, and approximate apparent whitespace for the chosen font family - also in em, and you'll get something like this... http://www.gunlaug.no/tos/alien/bl/test_09_0702-b.html ...with the same amount of whitespace (only the pixel-sized div-padding) on top and bottom of div, regardless of font-size. I have broken one paragraph in two, but you can use separate paragraphs if you give the top and bottom one classes and only subtract the apparent whitespace from top and bottom respectively. I'm not trying to achieve exact look across all browsers, I understand it's impossible. But I'm trying to achieve to make it look like the design at least.. in 1 browser (just so my designers are happy). Visual designers don't care much about reality on the web, so they should be easy to please ;-) FWIW: I often pull paragraphs and headlines this way, and most browsers handle it quite well. I usually don't bother to count pixels though, as in most cases it just has to look right. Georg -- http://www.gunlaug.no *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] working with line-height
Joseph Taylor wrote:
David,
What form elements / what browsers do you mean? I'm curious as I
haven't seen
anyone make comments against reset stylesheets as of yet.
To address the question (oops, forgot about that one) this is all I
could find in my bookmarks, but it is only in regard to the global reset
*{} but that is what David was referencing:
http://www.sitepoint.com/forums/showthread.php?t=517016
And it looks like Georg (as per usual) has a decent working solution for
the problem.
Mark
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
