Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

CSS-Tricks Almanac

10 views
Skip to first unread message

j

unread,
Apr 20, 2012, 5:55:38 AM4/20/12
to
The Almanac is still under construction, but if you haven't already seen
it, this is a great resource:

http://css-tricks.com/almanac/

David Stone

unread,
Apr 20, 2012, 8:55:25 AM4/20/12
to
In article <1kiujkc.1p8uv0ythsawgN%j...@macunlimited.net>,
Whoa - the CSS validator doesn't seem to like you very much!

<http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fcss-tricks
.com%2Falmanac%2F&profile=css21&usermedium=all&warning=1&vextwarning=&lan
g=en>

Stan Brown

unread,
Apr 21, 2012, 10:09:46 PM4/21/12
to
Flavell's Law strikes again!

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won't Help You:
http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you

j

unread,
Apr 22, 2012, 7:21:00 AM4/22/12
to
Stan Brown <the_sta...@fastmail.fm> wrote:

> On Fri, 20 Apr 2012 08:55:25 -0400, David Stone wrote:
> >
> > In article <1kiujkc.1p8uv0ythsawgN%j...@macunlimited.net>,
> > j...@macunlimited.net (j) wrote:
> >
> > > The Almanac is still under construction, but if you haven't already seen
> > > it, this is a great resource:
> > >
> > > http://css-tricks.com/almanac/
> >
> > Whoa - the CSS validator doesn't seem to like you very much!
> >
> > <http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fcss-tricks
> > .com%2Falmanac%2F&profile=css21&usermedium=all&warning=1&vextwarning=&lan
> > g=en>
>
> Flavell's Law strikes again!


I think Chris Coyier has done a great job (not just with the Almanac but
the whole site) with some very useful articles/videos/snippets covering
beginner tutorials through to cutting edge experimental stuff.

Overcome your cynicism! Have a look around.

Stan Brown

unread,
Apr 22, 2012, 8:41:19 AM4/22/12
to
You call it "cynicism" to say that people should know what they're
writing about?

Honey, I wouldn't bother looking at an architecture site if I knew
that the buildings presented there were structurally unsound.

Your opinion of Chris Coyler's "job" is neither here nor there. If he
can't write valid CSS, then whatever else he may have done he has
done the **opposite** of "a great job" writing about CSS.

Gus Richter

unread,
Apr 22, 2012, 9:16:11 AM4/22/12
to
On 4/22/2012 8:41 AM, Stan Brown wrote:
> Your opinion of Chris Coyler's "job" is neither here nor there. If he
> can't write valid CSS, then whatever else he may have done he has
> done the **opposite** of "a great job" writing about CSS.

The validator only checks for CSS2.1 and not for CSS3 for which the
validator is not set up yet and throws errors. The site uses lots of
CSS3 and browser proprietory tags (e.g. -webkit- prefix) which is also
normal to throw errors. The site is using current technology (HTML5) and
should be commended instead of put down.

--
Gus

idle

unread,
Apr 22, 2012, 10:15:10 AM4/22/12
to
On Sun, 22 Apr 2012 09:16:11 -0400, Gus Richter wrote in
comp.infosystems.www.authoring.stylesheets:
+1

--
idle
None of us is as good as all of us.

Jukka K. Korpela

unread,
Apr 22, 2012, 10:34:34 AM4/22/12
to
2012-04-22 16:16, Gus Richter wrote:

> The validator only checks for CSS2.1 and not for CSS3

The "W3C CSS Validator" has an option for "CSS level 3", as well as for
turning information about vendor extensions to warnings only. Didn't you
know that? Using them, http://css-tricks.com/almanac/ is reported to
have just 101 errors.

> The site is using current technology (HTML5)

HTML5 is very much work in progress and may (and often does) change at
any moment without prior notice. So how is the purported use of HTML5
supposed to be a justification for anything?

> and should be commended instead of put down.

For what reason? Whatever the technical issues might be,
http://css-tricks.com/almanac/ is messy and has horrible accessibility
problems, like light gray text on a little lighter gray background. So
expectations are rather low. Why should anyone waste time in looking at
it? There is no catastrophic shortage of information on CSS in the universe.

And it carries a prominent "Under Construction" sign, very much in the
style of the early 1990s, and I don't think it's a parody.

--
Yucca, http://www.cs.tut.fi/~jkorpela/

j

unread,
Apr 22, 2012, 11:12:13 AM4/22/12
to
Jukka K. Korpela <jkor...@cs.tut.fi> wrote:

> And it carries a prominent "Under Construction" sign, very much in the
> style of the early 1990s, and I don't think it's a parody.

It's made entirely of CSS!

tlvp

unread,
Apr 22, 2012, 12:01:40 PM4/22/12
to
On Sun, 22 Apr 2012 17:34:34 +0300, Jukka K. Korpela wrote:

> has horrible accessibility
> problems, like light gray text on a little lighter gray background

Fortunately, if you hover over any of those regions, the background turns a
bright strong rainbow color, and the text turns white, vastly improving the
contrast and raising the readability (if not the pleasurableness :-) of the
experience). Rather in the "hepater les bourgeois" style of Wired, I'd say.

Cheers, -- tlvp
--
Avant de repondre, jeter la poubelle, SVP.

Thomas 'PointedEars' Lahn

unread,
Apr 22, 2012, 12:12:42 PM4/22/12
to
Gus Richter wrote:

> On 4/22/2012 8:41 AM, Stan Brown wrote:
>> Your opinion of Chris Coyler's "job" is neither here nor there. If he
>> can't write valid CSS, then whatever else he may have done he has
>> done the **opposite** of "a great job" writing about CSS.
>
> The validator only checks for CSS2.1 and not for CSS3 for which the
> validator is not set up yet and throws errors.

The W3C CSS Validator can check at least for a part of the specified CSS3
syntax if you use the "CSS level 3" profile under "More Options". [1]
(Presumably those are from the modules of CSS3 that have already gained
Recommendation status.)

> The site uses lots of CSS3 and browser proprietory tags (e.g. -webkit-
> prefix)

Those are _proprietary_ (stylesheet) _properties_, not "browser proprietory
tags".

> which is also normal to throw errors.

The W3C CSS Validator supports "Vendor Extensions" like `-webkit-transform'
[2]; it can ignore them and issue a warning instead. [1] However,
apparently it does not support proprietary property values, like `-webkit-
radial-gradient(…)' [3].

> The site is using current technology (HTML5)

HTML5 is currently only a Working Draft. "The publication of this document
by the W3C as a W3C Working Draft does not imply that all of the
participants in the W3C HTML working group endorse the contents of the
specification. Indeed, for any section of the specification, one can usually
find many members of the working group or of the W3C as a whole who object
strongly to the current text, the existence of the section at all, or the
idea that the working group should even spend time discussing the concept of
that section." [4]

ISTM that you also do not know what you are talking about.


PointedEars
___________
[1] <http://jigsaw.w3.org/css-validator/#validate_by_uri+with_options>
[2] <http://www.webkit.org/blog/130/css-transforms/>
[3] <http://www.webkit.org/blog/1424/css3-gradients/>
[4] <http://www.w3.org/TR/2012/WD-html5-20120329/>
--
var bugRiddenCrashPronePieceOfJunk = (
navigator.userAgent.indexOf('MSIE 5') != -1
&& navigator.userAgent.indexOf('Mac') != -1
) // Plone, register_function.js:16

Ed Mullen

unread,
Apr 22, 2012, 12:52:23 PM4/22/12
to
WOW! No HTML? How'd they do that?!!!

--
Ed Mullen
http://edmullen.net/
Why is a man who invests all your money called a broker?

j

unread,
Apr 22, 2012, 1:37:30 PM4/22/12
to
Ed Mullen <e...@edmullen.net> wrote:

> j wrote:
> > Jukka K. Korpela<jkor...@cs.tut.fi> wrote:
> >
> >> And it carries a prominent "Under Construction" sign, very much in the
> >> style of the early 1990s, and I don't think it's a parody.
> >
> > It's made entirely of CSS!
> >
>
> WOW! No HTML? How'd they do that?!!!

Indeed. A lesson in itself, and one that wouldn't have worked in the
early 1990s.

And if that impresses you <g>, have a look at the frog, (or resize the
browser window).

Molly Mockford

unread,
Apr 22, 2012, 2:12:59 PM4/22/12
to
At 18:37:30 on Sun, 22 Apr 2012, j <j...@macunlimited.net> wrote in
<1kiyu69.16yrp8n18gvsn4N%j...@macunlimited.net>:

>Ed Mullen <e...@edmullen.net> wrote:
>
>> j wrote:
>> > Jukka K. Korpela<jkor...@cs.tut.fi> wrote:
>> >
>> >> And it carries a prominent "Under Construction" sign, very much in the
>> >> style of the early 1990s, and I don't think it's a parody.
>> >
>> > It's made entirely of CSS!
>> >
>>
>> WOW! No HTML? How'd they do that?!!!
>
>Indeed. A lesson in itself, and one that wouldn't have worked in the
>early 1990s.

Not true - it is most certainly not "made entirely of CSS"; it is made
of HTML, with extra added CSS for eye-candy.

<div class="under-construction">
<h3>Under Construction</h3>
<p>Launching for real sometime early 2012.</p>
</div>

>And if that impresses you <g>

It doesn't. I shouldn't think it impresses Ed either; I suggest you
check the batteries in your sarcasm detector.

>have a look at the frog, (or resize the browser window).

I see no frog, nor anything resembling one.
--
Molly Mockford
Nature loves variety. Unfortunately, society hates it. (Milton Diamond Ph.D.)
(My Reply-To address *is* valid, though may not remain so for ever.)

j

unread,
Apr 22, 2012, 2:40:56 PM4/22/12
to
Molly Mockford <nospam...@mollymockford.me.uk> wrote:

> >> j wrote:

> >And if that impresses you <g>
>
> It doesn't. I shouldn't think it impresses Ed either; I suggest you
> check the batteries in your sarcasm detector.


I never let them go completely flat (this being Usenet). They had just
enough preemptive power to put a "<g>" in the text.



>
> >have a look at the frog, (or resize the browser window).
>
> I see no frog, nor anything resembling one.


I think you might have scared it off.


Gus Richter

unread,
Apr 22, 2012, 2:53:56 PM4/22/12
to
On 4/22/2012 12:12 PM, Thomas 'PointedEars' Lahn wrote:
> ISTM that you also do not know what you are talking about.

It has been some time since I have navigated directly to Jigsaw since I
regularly use The Firefox Developer Toolbar/Tools/Validate CSS (among
the 6 validation options available) and I must admit that I was not
aware of the "Other Options" available in Jigsaw. I do apreciate having
this pointed out to me, although a more congenial way would have been
appreciated. Had I been aware, I would have pointed this out to the
previous posters to also be aware of this fact *in a helpful and
respectful way*, which I note you did not do.

The term of Vendor Extensions escaped me and I wrongly used tags which
was wrong and I apologize for it.

The state of HTML5 is in working draft and despite that some items are
questionable as to status, HTML5 nonetheless is the current defacto
state of the art and should be used in as far as it can.

Regarding your ISTM, ISTM that you should try to be less confrontational
and degrading in your posts and instead try only to be helpful.

--
Gus

Gus Richter

unread,
Apr 22, 2012, 3:12:06 PM4/22/12
to
See my response to Thomas for most answers as I see them.

The site tries to be helpful in many ways and embraces current defacto
technology which along with vendor extensions and IE Conditional
Statements run afoul with the Validator. This is no calamity. I commend
the author for using HTML5 for supporting HTML5 by using newer
technology. Another voice from another angle and in another way is
always helpful.

--
Gus

dorayme

unread,
Apr 22, 2012, 4:40:31 PM4/22/12
to
In article <1kiynls.t34wmyx0mvq8N%j...@macunlimited.net>,
j...@macunlimited.net (j) wrote:

...
> It's made entirely of CSS!

mmm... that makes it sound as if it is all style and no substance,
which is a little harsh, surely? <g>

--
dorayme

Thomas 'PointedEars' Lahn

unread,
Apr 22, 2012, 5:10:36 PM4/22/12
to
Gus Richter wrote:

> On 4/22/2012 12:12 PM, Thomas 'PointedEars' Lahn wrote:
>> ISTM that you also do not know what you are talking about.
>
> It has been some time since I have navigated directly to Jigsaw

QED.

> since I regularly use The Firefox Developer Toolbar/Tools/Validate CSS
> (among the 6 validation options available) and I must admit that I was not
> aware of the "Other Options" available in Jigsaw.

"_More_ Options" was introduced in 2006 CE [1]. Cyrille Moureaux's vendor
prefixes patch was added on 2011-01-12 [2] and released on 2011-01-31 [3].

QED again.

> The state of HTML5 is in working draft and despite that some items are
> questionable as to status, HTML5 nonetheless is the current defacto
> state of the art and should be used in as far as it can.

<http://caniuse.com/#cats=HTML5>

QED again.

> Regarding your ISTM, ISTM that you should try to be less confrontational
> and degrading in your posts and instead try only to be helpful.

I am just exposing wannabes for what they are. If you do not like that,
post something reasonable (well-researched, well-founded) instead.


PointedEars
___________
[1] <http://web.archive.org/web/20061218180038/http://jigsaw.w3.org/css-
validator/>
[2] CVS :pserver:anon...@dev.w3.org:/sources/public/2002/css-
validator/validator.html.en revision 1.50
[3] <http://web.archive.org/web/20110131104328/http://jigsaw.w3.org/css-
validator/>
--
> If you get a bunch of authors […] that state the same "best practices"
> in any programming language, then you can bet who is wrong or right...
Not with javascript. Nonsense propagates like wildfire in this field.
-- Richard Cornford, comp.lang.javascript, 2011-11-14

Gus Richter

unread,
Apr 22, 2012, 6:24:09 PM4/22/12
to
On 4/22/2012 5:10 PM, Thomas 'PointedEars' Lahn wrote:
>> Regarding your ISTM, ISTM that you should try to be less confrontational
>> > and degrading in your posts and instead try only to be helpful.
>
> I am just exposing wannabes for what they are. If you do not like that,
> post something reasonable (well-researched, well-founded) instead.

A quote from:
<http://www.bitonwire.com/javascript-forum/re-faq-maintainer_t3462.html>
sais it all.

Thomas Lahn is unsuitable because of his arrogant hectoring nature and
his lack of resemblance to a normal human being.

I have noted the same behaviour in the HTML and CSS groups and have
avoided you for your asinine behaviour.

I think it's Switzerland's high altitude and living in solitude in the
mountains only with cows for company which has made you antisocial.

You should try to be less confrontational and degrading in your posts
and instead try only to be helpful, but then you really don't know how
to be helpful, do you?

Oh, and piss on your QED. So very intelligent of you.

--
Gus
P.S. Do not expect any further responses from me.


j

unread,
Apr 22, 2012, 7:14:07 PM4/22/12
to
;-)
Yes, I was ignoring the html core; but I'm often surprised how much
substance can come out of the style with tricks such as:

.under-construction:before, .under-construction:after {
content: "";
position: absolute;
top: -10px;
height: 10px;
right: 0;
left: 0;
background-color: gray;
background-image: -webkit-repeating-linear-gradient(45deg,
transparent, transparent 35px, yellow 35px, yellow 70px);
}

dorayme

unread,
Apr 22, 2012, 8:03:58 PM4/22/12
to
In article <1kiz9ty.1blhkwweiclvoN%j...@macunlimited.net>,
j...@macunlimited.net (j) wrote:

> dorayme <dor...@optusnet.com.au> wrote:
>
> > In article <1kiynls.t34wmyx0mvq8N%j...@macunlimited.net>,
> > j...@macunlimited.net (j) wrote:
> >
> > ...
> > > It's made entirely of CSS!
> >
> > mmm... that makes it sound as if it is all style and no substance,
> > which is a little harsh, surely? <g>
>
>
> ;-)
> Yes, I was ignoring the html core; but I'm often surprised how much
> substance can come out of the style ...
>

You are certainly not wrong about this! You have put your finger on
the magic of CSS, its power, and its glory. And I applaud you for it.

Last time I came across one person applauding another in so many
words, was Captain Wentworth to Louisa Musgrove, mortifying Anne
Elliot who unintentionally overheard!

--
dorayme

Ed Mullen

unread,
Apr 22, 2012, 9:52:23 PM4/22/12
to
j wrote:
> Molly Mockford<nospam...@mollymockford.me.uk> wrote:
>
>>>> j wrote:
>
>>> And if that impresses you<g>
>>
>> It doesn't. I shouldn't think it impresses Ed either; I suggest you
>> check the batteries in your sarcasm detector.

Thank you, j. Saved me from replying to any of this nonsense. Sheesh.


--
Ed Mullen
http://edmullen.net/
Do hungry crows have ravenous appetites?

Ed Mullen

unread,
Apr 23, 2012, 2:27:11 PM4/23/12
to
Molly Mockford wrote:
> At 18:37:30 on Sun, 22 Apr 2012, j <j...@macunlimited.net> wrote in
> <1kiyu69.16yrp8n18gvsn4N%j...@macunlimited.net>:
>
>
> I see no frog, nor anything resembling one.

Upper right, under "Download" and "Deals".

--
Ed Mullen
http://edmullen.net/
"Love is the triumph of imagination over intelligence." - H. L. Mencken

Ben C

unread,
Apr 23, 2012, 4:37:13 PM4/23/12
to
On 2012-04-22, Jukka K. Korpela <jkor...@cs.tut.fi> wrote:
[...]
> For what reason? Whatever the technical issues might be,
> http://css-tricks.com/almanac/ is messy and has horrible accessibility
> problems, like light gray text on a little lighter gray background. So
> expectations are rather low. Why should anyone waste time in looking
> at it? There is no catastrophic shortage of information on CSS in the
> universe.

There isn't much I've come across that's both correct and explains it
clearly.

I had a look at the page on floats and spotted a relatively minor
inaccuracy (floating doesn't imply display: block-- you can float a
table or list-item), but it was otherwise good, and mentioned all the
usual problems people run into with floats and a few use-cases.

The page on z-index is mostly wrong unfortunately. And the one on
vertical-align isn't written yet. Maybe I'll put some comments in his
comments boxes.

Whatever the accessibility problems may be the design is beautiful to
look at.

David Stone

unread,
Apr 23, 2012, 4:59:54 PM4/23/12
to
In article <slrnjpbfbp....@bowser.marioworld>,
Ben C <spam...@spam.eggs> wrote:

> On 2012-04-22, Jukka K. Korpela <jkor...@cs.tut.fi> wrote:
> [...]
> > For what reason? Whatever the technical issues might be,
> > http://css-tricks.com/almanac/ is messy and has horrible accessibility
> > problems, like light gray text on a little lighter gray background. So
> > expectations are rather low. Why should anyone waste time in looking
> > at it? There is no catastrophic shortage of information on CSS in the
> > universe.
>
> There isn't much I've come across that's both correct and explains it
> clearly.
[snip]
>
> Whatever the accessibility problems may be the design is beautiful to
> look at.

Didn't care too much for it myself, but what do I know?

I DID find it ironic that the site sponsor ad (at least when I
revisited today) was for Treehouse: "What do you want to learn
today? Treehouse is the best place to learn web design, web
development, and iOS."

Molly Mockford

unread,
Apr 23, 2012, 6:23:33 PM4/23/12
to
At 14:27:11 on Mon, 23 Apr 2012, Ed Mullen <e...@edmullen.net> wrote in
<5j0sf5....@news.alt.net>:

>Molly Mockford wrote:
>> At 18:37:30 on Sun, 22 Apr 2012, j <j...@macunlimited.net> wrote in
>> <1kiyu69.16yrp8n18gvsn4N%j...@macunlimited.net>:
>>
>>
>> I see no frog, nor anything resembling one.
>
>Upper right, under "Download" and "Deals".

What, the two green-and-yellow squares? I guess I should really have
stretched my imagination.

dorayme

unread,
Apr 23, 2012, 6:30:39 PM4/23/12
to
In article <slrnjpbfbp....@bowser.marioworld>,
Ben C <spam...@spam.eggs> wrote:

Yes, I agree. The owners should be rightly pleased with themselves,
there is lots of very nice work in there and lots that is very
pleasing to the eye.

I was pleased to see something new to me as a technique on clearing
floats, not that I think it is so practical to use, "The Easy Clearing
Method". And I am sure there is lots more that will be new or
interesting as the site develops.

I have been used to saying floats cause elements to be taken out of
the flow, here he makes a point of saying they "remain a part of the
flow". I think I am technically correct but I don't think there is any
real contradiction because he is talking about a visual aspect.

Yes, he is worth sending comments to, good for you.

--
dorayme

Ben C

unread,
Apr 24, 2012, 3:16:59 AM4/24/12
to
On 2012-04-23, dorayme <dor...@optusnet.com.au> wrote:
[...]
> I was pleased to see something new to me as a technique on clearing
> floats, not that I think it is so practical to use, "The Easy Clearing
> Method".

That used to be quite common but you don't see it so much now. There's
some kind of grisly history to it; something like old version of IE grew
boxes to clear floats anyway and also didn't understand :after, so it
all worked. Something like that.

[...]
> I have been used to saying floats cause elements to be taken out of
> the flow, here he makes a point of saying they "remain a part of the
> flow". I think I am technically correct but I don't think there is any
> real contradiction because he is talking about a visual aspect.

I tend to avoid phrases like "taken out of the flow" because it's
difficult to tell what they mean.

I think he means they do push text out of the way unlike absolutely
positioned boxes; but you mean they don't stack up like normal or block
boxes. You're right and he's wrong. The "normal flow" is everything
except floats and positioned boxes.

But we shouldn't let him off too lightly here. If you use technical
terms you have to use them correctly or you spread confusion.

dorayme

unread,
Apr 24, 2012, 8:37:15 AM4/24/12
to
In article <slrnjpckrb....@bowser.marioworld>,
Ben C <spam...@spam.eggs> wrote:

> On 2012-04-23, dorayme <dor...@optusnet.com.au> wrote:
> [...]
...
> > I have been used to saying floats cause elements to be taken out of
> > the flow, here he makes a point of saying they "remain a part of the
> > flow". I think I am technically correct but I don't think there is any
> > real contradiction because he is talking about a visual aspect.
>
> I tend to avoid phrases like "taken out of the flow" because it's
> difficult to tell what they mean.
>
> I think he means they do push text out of the way unlike absolutely
> positioned boxes; but you mean they don't stack up like normal or block
> boxes. You're right and he's wrong. The "normal flow" is everything
> except floats and positioned boxes.
>
> But we shouldn't let him off too lightly here. If you use technical
> terms you have to use them correctly or you spread confusion.

Anyway, he deserves some slack because he captures a truth. An
absolutely positioned element easily can be miles in any direction
from where it would be, had it been positioned static. It could not
give a stuff about the normal flow. In its old age, it can get very
lonely, you know? It can estrange itself!

A floated element, on the other hand, can't be miles away in any
direction, it pays *very close attention* to the flow, it is more like
a good kid from a good family who does a few tricks without straying
too far.

In fact, the float very much attends to the flow and is very precise
about how it stands in relation to it. It is more literally a fellow
traveller of The Flow than any atheists are of The Word.

--
dorayme

Ed Mullen

unread,
Apr 24, 2012, 2:50:59 PM4/24/12
to
Molly Mockford wrote:
> At 14:27:11 on Mon, 23 Apr 2012, Ed Mullen <e...@edmullen.net> wrote in
> <5j0sf5....@news.alt.net>:
>
>> Molly Mockford wrote:
>>> At 18:37:30 on Sun, 22 Apr 2012, j <j...@macunlimited.net> wrote in
>>> <1kiyu69.16yrp8n18gvsn4N%j...@macunlimited.net>:
>>>
>>>
>>> I see no frog, nor anything resembling one.
>>
>> Upper right, under "Download" and "Deals".
>
> What, the two green-and-yellow squares? I guess I should really have
> stretched my imagination.

Weird. While loading the eyes are square but then turn round. Odd
effect. If they stay square for you you might try reloading the page.

--
Ed Mullen
http://edmullen.net/
How do you tell when you run out of invisible ink?

Gus Richter

unread,
Apr 24, 2012, 2:58:16 PM4/24/12
to
On 4/24/2012 3:16 AM, Ben C wrote:
> I tend to avoid phrases like "taken out of the flow" because it's
> difficult to tell what they mean.
>
> I think he means they do push text out of the way unlike absolutely
> positioned boxes; but you mean they don't stack up like normal or block
> boxes. You're right and he's wrong. The "normal flow" is everything
> except floats and positioned boxes.
>
> But we shouldn't let him off too lightly here. If you use technical
> terms you have to use them correctly or you spread confusion.

The "normal flow" is everything except floats and absolute (and fixed)
positioned boxes.

Absolute (and Fixed) Positioned - it's removed entirely from normal
flow; it is not in the "content flow", does not present width and height
to the document and is out of the "flow of the web page" as well.

Float - is not in the "content flow" in that it does not present width
and height to the document, however, the float's Margin Box is respected
by subsequent, both inline-level and block-level boxes, by essentially
pushing them left, right and/or down to make room for the float, so in
this regard the float has presence and remains a part of the "flow of
the web page".

I understand what he means and that there is a distinction between the
spec's "content flow" and the Almanac's "flow of the web page". Although
I feel it to be correct, the distinction between the two is too close
and I agree that it should not be used that way and as you say that it
causes confusion.

--
Gus

Gus Richter

unread,
Apr 24, 2012, 3:08:36 PM4/24/12
to
On 4/24/2012 2:50 PM, Ed Mullen wrote:
> Molly Mockford wrote:
>> At 14:27:11 on Mon, 23 Apr 2012, Ed Mullen <e...@edmullen.net> wrote in
>> <5j0sf5....@news.alt.net>:
>>
>>> Molly Mockford wrote:
>>>> At 18:37:30 on Sun, 22 Apr 2012, j <j...@macunlimited.net> wrote in
>>>> <1kiyu69.16yrp8n18gvsn4N%j...@macunlimited.net>:
>>>>
>>>>
>>>> I see no frog, nor anything resembling one.
>>>
>>> Upper right, under "Download" and "Deals".
>>
>> What, the two green-and-yellow squares? I guess I should really have
>> stretched my imagination.
>
> Weird. While loading the eyes are square but then turn round. Odd
> effect. If they stay square for you you might try reloading the page.

Border-radius is only supported in version 9.0 of IE. Previous IE
versions will come up with square eyes.

<http://caniuse.com/#search=border-radius>

--
Gus

Ben C

unread,
Apr 24, 2012, 5:31:05 PM4/24/12
to
On 2012-04-24, Gus Richter <gusri...@netscape.net> wrote:
[...]
> Float - is not in the "content flow" in that it does not present width
> and height to the document, however, the float's Margin Box is respected
> by subsequent, both inline-level and block-level boxes, by essentially
> pushing them left, right and/or down to make room for the float, so in
> this regard the float has presence and remains a part of the "flow of
> the web page".

Block boxes don't get pushed left/right/up/down because of floats unless
they're "block formatting context roots" (i.e. overflow: hidden since
that's the only way IIRC to have a normal-flow BFC) or have clear set on
them.

Even BFCs usually don't actually move for floats, they just get
narrower, but they can move down.

Molly Mockford

unread,
Apr 24, 2012, 6:09:53 PM4/24/12
to
At 15:08:36 on Tue, 24 Apr 2012, Gus Richter <gusri...@netscape.net>
wrote in <jn6tnm$tac$1...@dont-email.me>:
Firefox 12.0 - and I see no rounds.

Mind you, if I enable Javascript for the site, I see rounds; but the
OP's claim is that this is all done with CSS, right? So Javascript
should not be necessary.

Gus Richter

unread,
Apr 24, 2012, 6:59:30 PM4/24/12
to
I was thinking of a float followed by a div containing text and you are
right, only the text within the div is pushed sideways and not the div.

Regarding downward, I was thinking of a float followed by a floated div
each of a certain width such that the total is greater than the
container, resulting in the div being pushed down below the float.

I will refresh my memory on BFC's by reading up on them.

--
Gus

Gus Richter

unread,
Apr 24, 2012, 7:41:21 PM4/24/12
to
On 4/24/2012 6:09 PM, Molly Mockford wrote:
> Firefox 12.0 - and I see no rounds.
>
> Mind you, if I enable Javascript for the site, I see rounds; but the
> OP's claim is that this is all done with CSS, right? So Javascript
> should not be necessary.

Curious, the site uses border-radius:50% 50% 50% 50%; for each eye and
Javascript is not necessary, but obviously Javascript does come into
play there for other reasons and if not enabled, border-radius is also
cancelled.

--
Gus

tlvp

unread,
Apr 24, 2012, 9:46:05 PM4/24/12
to
On Tue, 24 Apr 2012 14:50:59 -0400, Ed Mullen wrote:

> Weird. While loading the eyes are square but then turn round. Odd
> effect. If they stay square for you you might try reloading the page.

Grab the right hand browser edge and push and pull to see Froggy there
change shape, change color, change how much of his puffy little face shows,
etc. Enjoy. Cheers, -- tlvp
--
Avant de repondre, jeter la poubelle, SVP.

Gus Richter

unread,
Apr 24, 2012, 10:04:32 PM4/24/12
to
On 4/24/2012 9:46 PM, tlvp wrote:
> On Tue, 24 Apr 2012 14:50:59 -0400, Ed Mullen wrote:
>
>> Weird. While loading the eyes are square but then turn round. Odd
>> effect. If they stay square for you you might try reloading the page.
>
> Grab the right hand browser edge and push and pull to see Froggy there
> change shape, change color, change how much of his puffy little face shows,
> etc. Enjoy. Cheers, -- tlvp

I see. Well isn't that just peachy cute?

--
Gus

Ed Mullen

unread,
Apr 24, 2012, 10:48:22 PM4/24/12
to
tlvp wrote:
> On Tue, 24 Apr 2012 14:50:59 -0400, Ed Mullen wrote:
>
>> Weird. While loading the eyes are square but then turn round. Odd
>> effect. If they stay square for you you might try reloading the page.
>
> Grab the right hand browser edge and push and pull to see Froggy there
> change shape, change color, change how much of his puffy little face shows,
> etc. Enjoy. Cheers, -- tlvp

I sure wish the URL hadn't been snipped out of this reply ... I had to
go searching back through previous posts to find it. Thanks. Trimming
posts is a great idea if done right. Not in this case.

--
Ed Mullen
http://edmullen.net/
I went to a bookstore and asked the saleswoman where the Self Help
section was. She said if she told me it would defeat the purpose.

Ed Mullen

unread,
Apr 24, 2012, 10:51:12 PM4/24/12
to
Sometimes people do stuff just because they can. I do that sometimes
but it's not always a good idea. Although it can be fun.

--
Ed Mullen
http://edmullen.net/
Why do they report power outages on TV?

tlvp

unread,
Apr 25, 2012, 5:03:51 AM4/25/12
to
On Tue, 24 Apr 2012 22:48:22 -0400, Ed Mullen wrote:

> tlvp wrote:
>> On Tue, 24 Apr 2012 14:50:59 -0400, Ed Mullen wrote:
>>
>>> Weird. While loading the eyes are square but then turn round. Odd
>>> effect. If they stay square for you you might try reloading the page.
>>
>> Grab the right hand browser edge and push and pull to see Froggy there
>> change shape, change color, change how much of his puffy little face shows,
>> etc. Enjoy. Cheers, -- tlvp
>
> I sure wish the URL hadn't been snipped out of this reply ...

URL wasn't snipped out of my reply, Ed, it was already snipped out of the
message (yours, I believe :-) ) to which I was replying. No harm done tho'.

> ... I had to
> go searching back through previous posts to find it. Thanks. Trimming
> posts is a great idea if done right. Not in this case.

Next time you'll know better :-) . Cheers, -- tlvp

Justin C

unread,
Apr 25, 2012, 4:16:01 AM4/25/12
to
On 2012-04-25, Ed Mullen <e...@edmullen.net> wrote:
>
> I sure wish the URL hadn't been snipped out of this reply ... I had to
> go searching back through previous posts to find it. Thanks. Trimming
> posts is a great idea if done right. Not in this case.

And it would have been nice for the rest of us if you'd included it too! :)

Justin.

--
Justin C, by the sea.

j

unread,
May 16, 2012, 6:47:17 PM5/16/12
to
On 4/20/2012 8:55 AM, David Stone wrote:
> In article<1kiujkc.1p8uv0ythsawgN%j...@macunlimited.net>,
> j...@macunlimited.net (j) wrote:
>
>> The Almanac is still under construction, but if you haven't already seen
>> it, this is a great resource:
>>
>> http://css-tricks.com/almanac/
>
> Whoa - the CSS validator doesn't seem to like you very much!

Almost everything in there is a vendor prefix error: -webkit- or such. I
can't fault that too much as I see it as a vendor issue. The property
without the vendor prefix is valid, but probably won't work!

I've started to use prefixfree:

http://leaverou.github.com/prefixfree/

It's either that or add all the silly prefixes or: wait a few more years
to use the CSS3 properties without the ridiculous prefix. Myself, I'm
ready for the CSS3 stuff, it's been too long coming.

Jeff

>
> <http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fcss-tricks
> .com%2Falmanac%2F&profile=css21&usermedium=all&warning=1&vextwarning=&lan
> g=en>

0 new messages