Re: [css-d] rem units and %

[Tedd Sperling]

On Sep 20, 2014, at 8:49 PM, Felix Miata  wrote:
> I know it's old, but the point is it's insane that one user stylesheet
> applicable to just one site would have reason to be so big.
> -- 

Felix:

As usual, you're right.

I think the problem is laziness and ignorance. They (the people who wrote the 
code) don't understand the css and instead of learning, they throw everything 
they have at it until it works (sort-of).

Cheers,

tedd

___
tedd sperling
t...@sperling.com

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Felix Miata]

Tom Livingston wrote on 2014-09-19 16:19 (GMT-0400):

> Felix Miata wrote:

>> I doubt
>> many practitioners using them have tested against user CSS to see how a UA
>> deals with the multiplied conflicts

[1]

> What I do see is failure to
> accommodate larger font sizes in the layout and therefore things over
> flow their containers or get cropped. That's poor planning.

Such apparent lack is typical of large sites

> This is
> failure on the designers/devs part. Not CSS's. Is CSS responsible for
> the containers not flexing? Technically, yes. Did it get into the site
> by itself and mess things up? No. It was used incorrectly.

HTML for newegg.com home is 636,601 bytes. Its *.css is 407,595 bytes in 6
files. HTML for one newegg.com product  page is
943,588 bytes, *.css 658,164 bytes in 10 files. HTML for logged in user
dashboard is 263,531 bytes, *.css 434,139 bytes in 10 files.  How much CSS
may be embedded in scripts or HTML I'm not about spend the time to try to
figure out. The weight of *.css alone is nuts, and newegg.com is anything but
an anomaly. It's hard to imagine how anyone stuck on POTS can stand needing
to use today's Internet.

You've surely heard this by Lord Acton before:
"Power corrupts. Absolute power corrupts absolutely."

CSS is power; IMO, too much power for too many to manage, widely misused,
widely misunderstood, and, in actual use, widely and wildly self-conflicting,
besides rude. All that misuse is routine in large sites, many fingers in each
pie surely, but too much power given those fingers nevertheless. At least
with presentation markup, there was a limit to how much the styling could
shrink the text below default. It wasn't as easy as now to make most text
gray on a gray background. With CSS, practitioners have the power, the
freedom, to ignore users' personalized optimums, and now that IE6 is dead,
more and more do exactly that.

Work of people frequenting here, regulars and noobs alike, is not
representative of the styling problems with big sites. One person, given and
using good instruction, is capable of enough restraint to stay out or get out
of most trouble; two or a few, probably the same. But, it's the same power of
CSS whether wisely used or not; no wonder why users complain web browsers use
too much RAM, or why pages don't work well; or in the case of defending via
user styles, why it takes noticeable time for content to stop jumping around
after switching pages within one domain.

[1]
$ ll new*
13706 Oct 21  2010 newegg.css
$ grep important newegg.css | wc -l
156

I know it's old, but the point is it's insane that one user stylesheet
applicable to just one site would have reason to be so big.
-- 
"The wise are known for their understanding, and pleasant
words are persuasive." Proverbs 16:21 (New Living Translation)

 Team OS/2 ** Reg. Linux User #211409 ** a11y rocks!

Felix Miata  ***  http://fm.no-ip.com/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Tom Livingston]

On Fri, Sep 19, 2014 at 4:12 PM, Felix Miata  wrote:
> Norman Fournier wrote on 2014-09-19 13:46 (GMT-0600):
>
>> the problem stated in the post is solved by CSS and media queries, not 
>> created by it.
>
> Actually, media queries have compounded the problems of CSS overuse. I doubt
> many practitioners using them have tested against user CSS to see how a UA
> deals with the multiplied conflicts. Gecko (at least; on Linux there is
> neither Safari nor IE, and Chrom* UI is useless in high DPI DEs, leaving it
> up to Konq, SeaMonkey and Firefox to hold down the fort) has the ability to
> remember zoom level on a per domain basis. Yet, multiple large domains I
> frequent have font sizes jumping all over the place, both literally and
> figuratively, only since queries were implemented on those domains. Despite
> the UA memory, or maybe because of it, I'm forced to change zoom levels both
> up and down when switching among multiple simultaneously open tabs on domains
> employing queries. e.g. newegg.com.
> --
> "The wise are known for their understanding, and pleasant
> words are persuasive." Proverbs 16:21 (New Living Translation)
>
>  Team OS/2 ** Reg. Linux User #211409 ** a11y rocks!
>
> Felix Miata  ***  http://fm.no-ip.com/



Quickly resizing my browser width, I don't notice any MQs on the
newegg site as far as I can tell. What I do see is failure to
accommodate larger font sizes in the layout and therefore things over
flow their containers or get cropped. That's poor planning. This is
failure on the designers/devs part. Not CSS's. Is CSS responsible for
the containers not flexing? Technically, yes. Did it get into the site
by itself and mess things up? No. It was used incorrectly.



-- 

Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Felix Miata]

Norman Fournier wrote on 2014-09-19 13:46 (GMT-0600):

> the problem stated in the post is solved by CSS and media queries, not 
> created by it.

Actually, media queries have compounded the problems of CSS overuse. I doubt
many practitioners using them have tested against user CSS to see how a UA
deals with the multiplied conflicts. Gecko (at least; on Linux there is
neither Safari nor IE, and Chrom* UI is useless in high DPI DEs, leaving it
up to Konq, SeaMonkey and Firefox to hold down the fort) has the ability to
remember zoom level on a per domain basis. Yet, multiple large domains I
frequent have font sizes jumping all over the place, both literally and
figuratively, only since queries were implemented on those domains. Despite
the UA memory, or maybe because of it, I'm forced to change zoom levels both
up and down when switching among multiple simultaneously open tabs on domains
employing queries. e.g. newegg.com.
-- 
"The wise are known for their understanding, and pleasant
words are persuasive." Proverbs 16:21 (New Living Translation)

 Team OS/2 ** Reg. Linux User #211409 ** a11y rocks!

Felix Miata  ***  http://fm.no-ip.com/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Felix Miata]

MiB wrote on 2014-09-19 21:40 (GMT+0200):

> Felix Miata composed:

>> The natural talent of every modern web browser to adapt content to the user's
>> environment is usurped by CSS attempting to make every page look like
>> Photoshopped image, and at an arbitrary size bearing no predictable
>> relationship to the physical characteristics of the environment opened
>> within.

> No! I won’t have that. It’s a certain breed of designers doing that, not 
> "CSS".

The behavior too pervades the web to be any one breed. Moreover, there's
pervasive instruction in use of CSS, and some of the power that CSS includes,
that leads the "breed" to believe CSS is intended to be determinative rather
than suggestive. Practitioners routinely use CSS power to such extent that
user power to override what is supposed to be suggestion as a practical
matter is little short of lip service.
-- 
"The wise are known for their understanding, and pleasant
words are persuasive." Proverbs 16:21 (New Living Translation)

 Team OS/2 ** Reg. Linux User #211409 ** a11y rocks!

Felix Miata  ***  http://fm.no-ip.com/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Norman Fournier]

On 2014-09-19, at 1:40 PM, MiB wrote:

> 
> sep 18 2014 22:47 Felix Miata :
> 
>> The natural talent of every modern web browser to adapt content to the user's
>> environment is usurped by CSS attempting to make every page look like
>> Photoshopped image, and at an arbitrary size bearing no predictable
>> relationship to the physical characteristics of the environment opened
>> within.
> 
> 
> No! I won’t have that. It’s a certain breed of designers doing that, not 
> "CSS".

CSS is a tool that can be misused and not at fault for it's misuse. I don't 
understand the point of trying to demonize CSS as responsible for poor web 
design. The www would be a disaster without CSS and the problem stated in the 
post is solved by CSS and media queries, not created by it.

Norman
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[MiB]

sep 18 2014 22:47 Felix Miata :

> The natural talent of every modern web browser to adapt content to the user's
> environment is usurped by CSS attempting to make every page look like
> Photoshopped image, and at an arbitrary size bearing no predictable
> relationship to the physical characteristics of the environment opened
> within.


No! I won’t have that. It’s a certain breed of designers doing that, not "CSS".

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Felix Miata]

Jukka K. Korpela wrote on 2014-09-18 09:06 (GMT+0300):

> Felix Miata wrote:

>> When you set a width in rem, the ratio between base font size and the
>> container's design width remains constant no matter how many layers deep that
>> container lives, and no matter what the base font size is.

> Normally what should matter is the ratio between the element's own font 
> size and the element's width.

Ideally from a user perspective, for the majority of content, the two ratios
should in practical effect be identical.

The reality of course is that on most of the web, the simplification that
cascading originally offered in divorcing content from presentation has been
mostly lost by CSS's misuse as a pseudo page layout language treating the web
as if it was print. Site after site repeats ad infinitum equivalent
declarations on a hopelessly complex overabundance of classes, many of which,
because of cascade, conflict, and ultimately, get "fixed" by adding more
declarations instead of culling down to the minimum necessary to get the job
done. Too often the CSS outweighs the (X)HTML.

The natural talent of every modern web browser to adapt content to the user's
environment is usurped by CSS attempting to make every page look like
Photoshopped image, and at an arbitrary size bearing no predictable
relationship to the physical characteristics of the environment opened
within. The latter day addition of the rem unit to a rather evolved CSS
specification does offer the practitioner a practical opportunity to work
around some of the complexity that cascade induces.
-- 
"The wise are known for their understanding, and pleasant
words are persuasive." Proverbs 16:21 (New Living Translation)

 Team OS/2 ** Reg. Linux User #211409 ** a11y rocks!

Felix Miata  ***  http://fm.no-ip.com/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Tom Livingston]

On Thu, Sep 18, 2014 at 10:53 AM, John  wrote:
>
> On Sep 18, 2014, at 5:47 AM, Tom Livingston  wrote:
>
>> I haven't heard any arguments about not using rem for anything but
>> font-size until this thread. I've only heard that it's no different
>> than using em, except for the lack of the compounding issue associated
>> with em. And that's a really good thing.
>
> Such as that problem I had yesterday, where em values seemed to double in the 
> spot where I had an h2 enclosed by my h1?
>
> John

That's what it looked like to me, yes.


-- 

Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[John]

On Sep 18, 2014, at 5:47 AM, Tom Livingston  wrote:

> I haven't heard any arguments about not using rem for anything but
> font-size until this thread. I've only heard that it's no different
> than using em, except for the lack of the compounding issue associated
> with em. And that's a really good thing.

Such as that problem I had yesterday, where em values seemed to double in the 
spot where I had an h2 enclosed by my h1?

John
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Tom Livingston]

On Wed, Sep 17, 2014 at 3:49 PM, John  wrote:
>
> On Sep 16, 2014, at 7:35 PM, Eric  wrote:
>
>> Did you read on this list that the REM unit is only for type? - It's a 
>> relative unit like any other relative unit. I use it for everything except 
>> element widths (they get %s) and line-height that should be unitless.
>
> No, I mean that in my gathering information about proper use of rems, I’m 
> looking far and wide (online, people I know) and there is a disagreement as 
> to how rem units should be used.
>
> As I take this site responsive, I’m going with % also.
>
> Thank you,
>
> John
> __


I haven't heard any arguments about not using rem for anything but
font-size until this thread. I've only heard that it's no different
than using em, except for the lack of the compounding issue associated
with em. And that's a really good thing.


-- 

Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Jukka K. Korpela]

2014-09-18 1:44, Felix Miata wrote:


One of the rem unit's important features, if not its most important, is that
size cascade is ignored.


Indeed the very point of the rem unit is to set the size of something 
using Cascading Style Sheets so that the cascade is avoided. Opinions 
disagree on whether this is a good idea.



When you set a width in rem, the ratio between base font size and the
container's design width remains constant no matter how many layers deep that
container lives, and no matter what the base font size is.


Normally what should matter is the ratio between the element's own font 
size and the element's width.


Yucca

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Crest Christopher]

There needs to be a guideline on EM's & REM's what about using them for 
positioning.  I was helped from someone on this list with that a few 
weeks ago regarding using them as positioning.


This topic re-surfaces quite frequently, there should be some 
guidelines, then if the developer wants to expand on those guidelines 
they can, if not, the guide is more then adequate for any or all web 
page development.


Felix Miata wrote:

John wrote on 2014-09-17 12:49 (GMT-0700):


I mean that in my gathering information about proper use of rems, I’m
looking far and wide (online, people I know) and there is a disagreement
as to how rem units should be used.


One of the rem unit's important features, if not its most important, is that
size cascade is ignored. IMO it thus exists so that containers, and text, can
be (respectfully) sized *simply*, and *reliably*. Regardless of opinions what
the rem unit "should" be used for, the absence of cascade on text and
containers sized using rem the avoids the obfuscation font size cascade can
create, which often makes results seem inexplicable (and causes new threads
to start here).

When you set a width in rem, the ratio between base font size and the
container's design width remains constant no matter how many layers deep that
container lives, and no matter what the base font size is. Absent a viewport
contstraint, and absent you overriding the user's personal optimum font size
(his browser's default size setting) WRT that particular container, your e.g.
11 words wide container will hold 11 optimally sized words regardless whether
the user's default is 3mm, 12pt, 73px, 11px, 29px, 43px, etc. IOW, the user
agent's default size is, as it should be to stylists, irrelevant...


...responsive...


...a concept fundamental to the very idea of responsive design.

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Felix Miata]

John wrote on 2014-09-17 12:49 (GMT-0700):

> I mean that in my gathering information about proper use of rems, I’m
> looking far and wide (online, people I know) and there is a disagreement
> as to how rem units should be used.

One of the rem unit's important features, if not its most important, is that
size cascade is ignored. IMO it thus exists so that containers, and text, can
be (respectfully) sized *simply*, and *reliably*. Regardless of opinions what
the rem unit "should" be used for, the absence of cascade on text and
containers sized using rem the avoids the obfuscation font size cascade can
create, which often makes results seem inexplicable (and causes new threads
to start here).

When you set a width in rem, the ratio between base font size and the
container's design width remains constant no matter how many layers deep that
container lives, and no matter what the base font size is. Absent a viewport
contstraint, and absent you overriding the user's personal optimum font size
(his browser's default size setting) WRT that particular container, your e.g.
11 words wide container will hold 11 optimally sized words regardless whether
the user's default is 3mm, 12pt, 73px, 11px, 29px, 43px, etc. IOW, the user
agent's default size is, as it should be to stylists, irrelevant...

> ...responsive...

...a concept fundamental to the very idea of responsive design.
-- 
"The wise are known for their understanding, and pleasant
words are persuasive." Proverbs 16:21 (New Living Translation)

 Team OS/2 ** Reg. Linux User #211409 ** a11y rocks!

Felix Miata  ***  http://fm.no-ip.com/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[John]

On Sep 16, 2014, at 7:35 PM, Eric  wrote:

> Did you read on this list that the REM unit is only for type? - It's a 
> relative unit like any other relative unit. I use it for everything except 
> element widths (they get %s) and line-height that should be unitless. 

No, I mean that in my gathering information about proper use of rems, I’m 
looking far and wide (online, people I know) and there is a disagreement as to 
how rem units should be used.

As I take this site responsive, I’m going with % also.

Thank you,

John
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Eric]

Did you read on this list that the REM unit is only for type? - It's a relative
unit like any other relative unit. I use it for everything except element widths
(they get %s) and line-height that should be unitless.

There are some strange "rules of thumb" floating around out thereTake a look
at the spec:
http://www.w3.org/TR/css3-values/#rem-unit


> On September 16, 2014 at 5:11 PM John  wrote:
>
>
> If rem units are for font size and margins and padding get % values, does it
> get fairly hairy knowing what % you need for your margin/padding? Always of
> the parent, of course, but what if you have an ul in your sidebar and another
> in a main content div, which is much wider than the sidebar..
>
> I guess through the use of descendent selectors, you dial in on the correct %
> value for each instance?
>
> am I making this out to be more difficult than it really is?
>
> Thank you!
>
> John
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[John]

On Sep 16, 2014, at 6:36 PM, Philippe Wittenbergh  wrote:

> 
> Le 17 sept. 2014 à 10:30, John  a écrit :
> 
>> so, if rem units are specifically for type
> 
> They are not…
> 
>> and not for positioning,
> 
> Rem can be used for positioning, why wouldn’t it? I frequently specify 
> padding / margin in rem

The two above points, I’ve gotten from this list and from elsewhere online, and 
from colleagues..there seems to be a healthy lack of agreement on how rems 
should be used…I’ve heard the opposite also argued for..it’s a wee bit 
mystifying.


>> then what about things like line-height?
> 
> Specify line-height without an unit.

Thank you, Philippe!

John
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Philippe Wittenbergh]

Le 17 sept. 2014 à 10:30, John  a écrit :

> so, if rem units are specifically for type

They are not…

> and not for positioning,

Rem can be used for positioning, why wouldn’t it? I frequently specify padding 
/ margin in rem

> then what about things like line-height?

Specify line-height without an unit.


Philippe
--
Philippe Wittenbergh
http://l-c-n.com/





__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Tom Livingston]

On Tuesday, September 16, 2014, John  wrote:

> so, if rem units are specifically for type and not for positioning, then
> what about things like line-height? Should line-height be expressed in rems
> if the font-size is expressed in rems?
>
> I would think so, since line-height acts on the type, rather than on the
> type’s container..but I am not the oracle..
>
> ;-)
>
> Thank you,
>
> John
>
>
As far as I know, it's best to leave line height unit-less.

From:
http://css-tricks.com/almanac/properties/l/line-height/

Unitless line heights are recommended due to the fact that child elements
will inherit the raw number value, rather than the computed value. With
this, child elements can compute their line heights based on their computed
font size, rather than inheriting an arbitrary value from a parent that is
more likely to need overriding.



-- 

Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[John]

so, if rem units are specifically for type and not for positioning, then what 
about things like line-height? Should line-height be expressed in rems if the 
font-size is expressed in rems?

I would think so, since line-height acts on the type, rather than on the type’s 
container..but I am not the oracle..

;-)

Thank you,

John
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Tom Livingston]

On Tuesday, September 16, 2014, John  wrote:

>
> On Sep 16, 2014, at 2:29 PM, Jukka K. Korpela  > wrote:
>
> > Percentages have their use, but for margin and padding, they are mostly
> unsuitable. The padding between text and the edge of an element should
> relate to the font size, not the total width of something.
>
> Thank you, Jukka….I don’t expect anyone here to be a mind-reader, but why
> do so many advocate using % for margin and padding?
>
> what is a proper use of % for margin and padding? is it for something like
> the width of a content div which you want to be 66.7% the width of its
> container?
>
> thank you!
>
> John
> ___
>

Some will use % for margin or padding in a fluid grid. For example, based
on a max content width of 960px, a two column layout might have a main col
of 650px, a side bar of 250 and a gutter of 60. Using percentages, that
would be 67%, 26% and 6% with 1% wiggle room (I don't recommend making
everything add up to exactly 100% because of differences in browser
renderings).


-- 

Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[John]

On Sep 16, 2014, at 2:29 PM, Jukka K. Korpela  wrote:

> Percentages have their use, but for margin and padding, they are mostly 
> unsuitable. The padding between text and the edge of an element should relate 
> to the font size, not the total width of something.

Thank you, Jukka….I don’t expect anyone here to be a mind-reader, but why do so 
many advocate using % for margin and padding?  

what is a proper use of % for margin and padding? is it for something like the 
width of a content div which you want to be 66.7% the width of its 
container?

thank you!

John
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] rem units and %

[Jukka K. Korpela]

2014-09-17 0:11, John wrote:


If rem units are for font size and margins and padding get % values,
does it get fairly hairy knowing what % you need for your
margin/padding?


Yes. Or, rather, impossible. You would need to make a guess and go wrong 
often.



I guess through the use of descendent selectors, you dial in on the
correct % value for each instance?


What?


am I making this out to be more difficult than it really is?


Yes. Use consistent units. If you really want pixels (thinking that your 
sizes fit everyone), use px. If you want dimensions that adapt to the 
user’s chosen font size, use em (the rem tends to cause confusion, and 
at best, it just lets you avoid some calculations). Percentages have 
their use, but for margin and padding, they are mostly unsuitable. The 
padding between text and the edge of an element should relate to the 
font size, not the total width of something.


Yucca

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] rem units and %

[John]

If rem units are for font size and margins and padding get % values, does it 
get fairly hairy knowing what % you need for your margin/padding?  Always of 
the parent, of course, but what if you have an ul in  your sidebar and another 
in a main content div, which is much wider than the sidebar..

I guess through the use of descendent selectors, you dial in on the correct % 
value for each instance?

am I making this out to be more difficult than it really is?

Thank you!

John
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/