«

In article <timstreater->,
Tim Streater <> wrote:

> I wanted to have a fixed size scrollable area within a table cell, and
> googling threw this up:
>
>
> .scrollarea
> {
> width: 300px;
> height: 276px;
> padding-left: 5px;
> padding-right: 5px;
> border-color: #6699CC;
> border-width: 1px;
> border-style: solid;
> float: left;
> overflow: auto;
> }
>
> I use it like this:
>
> <tr id='glist'>
>
> <td style="vertical-align: top; padding-right: 15px;">Group List:</td>
>
> <td style="vertical-align: top; background-color: #F0F0FF; padding:
> 3px;"><span class='scrollarea' id='group_list'></span></td>
>
> </tr>
>
>
> It's unlikely I could have come up with the scrollarea class by myself,
> but it seems to do the job I wanted it to: a fixed area within a table
> cell that I can write stuff into and which will have a vertical scroll
> bar when necessary.
>
> However I am at a loss to understand what the float:left does other than
> make it work. I tried removing it and the <span> content overflowed the
> table cell, and every line of the content appeared to be underlined or
> possibly have a border. Why does the float have this effect?

Making the span a float trips it into being what is called a Block
Formatting Context. This context is actually owned by Ben C but I hire
it off him for an undisclosed fee which I send him regularly. I have a
few things about it at

<http://netweaver.com.au/floatHouse/page8.php>

and you can read a lot more by searching these usenet groups.

Also

<http://www.w3.org/TR/CSS2/visuren.html#block-formatting>

What you are seeing as underlining, btw, is actually border on the
span. When you float, the element makes like a block, a fortress where
intruders are not welcome, the whole thing is a block and the border
goes all around it (rather than the span remaining its default
display: inline and so all its lines have the focus taken off it.

--
dorayme

In article <dorayme->,
dorayme <> wrote:

> In article <timstreater->,
> Tim Streater <> wrote:

> > However I am at a loss to understand what the float:left does other than
> > make it work. I tried removing it and the <span> content overflowed the
> > table cell, and every line of the content appeared to be underlined or
> > possibly have a border. Why does the float have this effect?
>
> Making the span a float trips it into being what is called a Block
> Formatting Context. This context is actually owned by Ben C but I hire
> it off him for an undisclosed fee which I send him regularly.

Ben deserves every penny.

> I have a few things about it at
>
> <http://netweaver.com.au/floatHouse/page8.php>

Ah, those useful pages again.

> and you can read a lot more by searching these usenet groups.
>
> Also
>
> <http://www.w3.org/TR/CSS2/visuren.html#block-formatting>
>
> What you are seeing as underlining, btw, is actually border on the
> span. When you float, the element makes like a block, a fortress where
> intruders are not welcome, the whole thing is a block and the border
> goes all around it (rather than the span remaining its default
> display: inline and so all its lines have the focus taken off it.

So the originator of this class was just after a side-effect then.
Always a bad idea to do that, IMO.

--
Tim

"That excessive bail ought not to be required, nor excessive fines imposed,
nor cruel and unusual punishments inflicted" -- Bill of Rights 1689

In article <timstreater->,
Tim Streater <> wrote:

> In article <dorayme->,
> dorayme <> wrote:
>
> > In article <timstreater->,
> > Tim Streater <> wrote:
>
....
> >
> > What you are seeing as underlining, btw, is actually border on the
> > span. When you float, the element makes like a block, a fortress where
> > intruders are not welcome, the whole thing is a block and the border
> > goes all around it (rather than the span remaining its default
> > display: inline and so all its lines have the focus taken off it.
>
> So the originator of this class was just after a side-effect then.
> Always a bad idea to do that, IMO.

The person who used this class might have had other things he wanted,
I don't know without seeing his original. What is a side effect and
what is not is a slippery concept in CSS. People sometimes have use
floats for their shraxpand to fit properties, its *just styling*, they
could use a table cell which also shraxpands (if the author does not
go specify a width, if it is 'width: auto' in other words). Now, a
conscious use of a table *just for this* would be a bad idea.

Much interesting styling is smoke and mirrors and the bread-and-butter
attitude that is appropriate to HTML is not so appropriate with CSS.
Beaut things are negative margins, columns made from borders, and in
fact, everything in CSS that is not quite what it seems to be! If it
ever became completely tame and predictable and teachable to an Adobe
robot then that would be a sad day. Whereas in HTML, everything should
be exactly what it is.

--
dorayme

On 4/20/2012 3:30 PM, Tim Streater wrote:
> So the originator of this class was just after a side-effect then.
> Always a bad idea to do that, IMO.

Not so at all. It is quite legit according to the specifications as I
tried to explain. It is not so very long ago that web authors started
fiddling around with CSS. In fact there was a sector dead set against
it; that it would not fly, they would not use it, etc.. The web authors
experimented and found things that worked and those that did not. This
method worked for him and he posted it. I recall Ben and I discussing
why and how of things regarding some aspect of CSS and having to look
here and there on different pages in the specifications for the complete
picture reasons and explanations. I would hazard to guess that the page
you found is relatively old and reflects what a web author found as a
solution without truly understanding the reason as to why and how it
worked. If he did he would have included the alternate method with a DIV.

--
Gus

In article <dorayme->,
dorayme <> wrote:

> In article <timstreater->,
> Tim Streater <> wrote:
>
> > In article <dorayme->,
> > dorayme <> wrote:
> >
> > > In article <timstreater->,
> > > Tim Streater <> wrote:
> >
> ...
> > >
> > > What you are seeing as underlining, btw, is actually border on the
> > > span. When you float, the element makes like a block, a fortress where
> > > intruders are not welcome, the whole thing is a block and the border
> > > goes all around it (rather than the span remaining its default
> > > display: inline and so all its lines have the focus taken off it.
> >
> > So the originator of this class was just after a side-effect then.
> > Always a bad idea to do that, IMO.
>
> The person who used this class might have had other things he wanted,
> I don't know without seeing his original. What is a side effect and
> what is not is a slippery concept in CSS. People sometimes have use
> floats for their shraxpand to fit properties, its *just styling*, they
> could use a table cell which also shraxpands (if the author does not
> go specify a width, if it is 'width: auto' in other words). Now, a
> conscious use of a table *just for this* would be a bad idea.
>
> Much interesting styling is smoke and mirrors and the bread-and-butter
> attitude that is appropriate to HTML is not so appropriate with CSS.
> Beaut things are negative margins, columns made from borders, and in
> fact, everything in CSS that is not quite what it seems to be! If it
> ever became completely tame and predictable and teachable to an Adobe
> robot then that would be a sad day. Whereas in HTML, everything should
> be exactly what it is.

Hmmm. You realise this is just what puts people off CSS? That may be OK
is you like fiddling with CSS *for its own sake*. But personally I
object to smoke and mirrors stuff because it takes time away from the
main business. Well - never mind, and I'll say thanks again to avoid
appearing ungracious.

--
Tim

"That excessive bail ought not to be required, nor excessive fines imposed,
nor cruel and unusual punishments inflicted" -- Bill of Rights 1689

In article <timstreater->,
Tim Streater <> wrote:

> In article <dorayme->,
> dorayme <> wrote:
>
> > In article <timstreater->,
> > Tim Streater <> wrote:
> >
> > > In article <dorayme->,
> > > dorayme <> wrote:
> > >
> > > > In article <timstreater->,
> > > > Tim Streater <> wrote:
> > >
> > ...
> > > >
> > > > What you are seeing as underlining, btw, is actually border on the
> > > > span. When you float, the element makes like a block, a fortress where
> > > > intruders are not welcome, the whole thing is a block and the border
> > > > goes all around it (rather than the span remaining its default
> > > > display: inline and so all its lines have the focus taken off it.
> > >
> > > So the originator of this class was just after a side-effect then.
> > > Always a bad idea to do that, IMO.
> >
> > The person who used this class might have had other things he wanted,
> > I don't know without seeing his original. What is a side effect and
> > what is not is a slippery concept in CSS. People sometimes have use
> > floats for their shraxpand to fit properties, its *just styling*, they
> > could use a table cell which also shraxpands (if the author does not
> > go specify a width, if it is 'width: auto' in other words). Now, a
> > conscious use of a table *just for this* would be a bad idea.
> >
> > Much interesting styling is smoke and mirrors and the bread-and-butter
> > attitude that is appropriate to HTML is not so appropriate with CSS.
> > Beaut things are negative margins, columns made from borders, and in
> > fact, everything in CSS that is not quite what it seems to be! If it
> > ever became completely tame and predictable and teachable to an Adobe
> > robot then that would be a sad day. Whereas in HTML, everything should
> > be exactly what it is.
>
> Hmmm. You realise this is just what puts people off CSS? That may be OK
> is you like fiddling with CSS *for its own sake*. But personally I
> object to smoke and mirrors stuff because it takes time away from the
> main business.

Well, I respect the attitude of liking properties that have names and
behaviours that sound like what they do. And I respect, but with
severe limitations, the practice of only using them for the purposes
they were originally created for. There are - maybe - a few formally
minded mechanics that have this attitude towards tools. However, my
own experience is that the best of them find creative uses for their
tools. (I know what I do in the garage to cars! You would be
absolutely appalled - even though my cars and motor bikes have always
run nicely. <g>).

If anyone thinks that CSS has been as precise as mechanical tools in
their purpose and effect, they might seriously be misjudging the
reality.


> Well - never mind, and I'll say thanks again to avoid
> appearing ungracious.

You never appear ungracious Tim. Please don't feel obliged. I post
here because I find the issues interesting, in the hope that people
will discuss these things. Not only to help with practical problems.
You did ask a rather interesting question about why something worked
and I tried to answer this as best as I could. But there are other
issues that this leads onto and which you have no obligation at all to
be interested in.

Your idea of "the main business" of web pages and your concept of
being interested in CSS "for its own sake" deserves a comment or two.

Simple communication and not trying to be too arty about it is a fine
thing. But aesthetics is something that is important to a lot of
people, it makes things interesting and yes, for its own aesthetic
sake. Sometimes the aesthetics is the main point.

It is fine not to be interested in this aspect much. It is fine not to
be interested in paintings or photos or films for their own sake but
just for the practical message they communicate.

But for many of us who are interested in more than the practical
message of many things, aesthetics is important, it is an end in
itself.

Few good painters are uninterested in the properties of their
materials and equipment who are also shy of veering from the
instructions and ideas printed on their labels. I can't imagine my
life as a keen photographer for so many years without being really
interested in how my materials and equipment worked and thinking about
how to use them in different ways, both in and out of the darkroom.

Try useful absolute positioning without slapping on 'position:
relative' on some container you want to position in relation to. The
style is precisely for its side effect.

<http://dorayme.netweaver.com.au/abso...earest_positio
ned_ancestor.html>

Seriously, Tim, CSS is riddled in more ways than you maybe are
imagining with the usefulness of "side-effects" even for very
practical purposes.

--
dorayme

In article <dorayme->,
dorayme <> wrote:

> Your idea of "the main business" of web pages and your concept of
> being interested in CSS "for its own sake" deserves a comment or two.
>
> Simple communication and not trying to be too arty about it is a fine
> thing. But aesthetics is something that is important to a lot of
> people, it makes things interesting and yes, for its own aesthetic
> sake. Sometimes the aesthetics is the main point.

Then perhaps its about how we define aesthetics. To me it includes doing
things in the most simple, straightforward, and effective way, and from
an engineering perspective it should be maintainable too.

> It is fine not to be interested in this aspect much. It is fine not to
> be interested in paintings or photos or films for their own sake but
> just for the practical message they communicate.
>
> But for many of us who are interested in more than the practical
> message of many things, aesthetics is important, it is an end in
> itself.
>
> Few good painters are uninterested in the properties of their
> materials and equipment who are also shy of veering from the
> instructions and ideas printed on their labels. I can't imagine my
> life as a keen photographer for so many years without being really
> interested in how my materials and equipment worked and thinking about
> how to use them in different ways, both in and out of the darkroom.

But that only affects you. Software standards, however, will affect many
people.

> Try useful absolute positioning without slapping on 'position:
> relative' on some container you want to position in relation to. The
> style is precisely for its side effect.
>
> <http://dorayme.netweaver.com.au/abso...earest_positio
> ned_ancestor.html>
>
> Seriously, Tim, CSS is riddled in more ways than you maybe are
> imagining with the usefulness of "side-effects" even for very
> practical purposes.

Oh, I can well imagine that. But I thought side effects were, in
computer science, supposed to be a bad idea. Orthogonality comes to mind.

--
Tim

"That excessive bail ought not to be required, nor excessive fines imposed,
nor cruel and unusual punishments inflicted" -- Bill of Rights 1689

In article <timstreater->,
Tim Streater <> wrote:

> In article <dorayme->,
> dorayme <> wrote:
>
> > Your idea of "the main business" of web pages and your concept of
> > being interested in CSS "for its own sake" deserves a comment or two.
> >
> > Simple communication and not trying to be too arty about it is a fine
> > thing. But aesthetics is something that is important to a lot of
> > people, it makes things interesting and yes, for its own aesthetic
> > sake. Sometimes the aesthetics is the main point.
>
> Then perhaps its about how we define aesthetics.

We don't have to define aesthetics to see that some people make and
want many things including web pages for reasons other than simple
communication.

> To me it includes doing
> things in the most simple, straightforward, and effective way, and from
> an engineering perspective it should be maintainable too.
>

No sensible person would disagree. Beyond motherhood though, there are
different "things" that are done and the "most simple,
straightforward, and effective way" of doing them can involve an
awfully fancy lot of footwork behind the scenes, by any objective
measure of footwork.

> > It is fine not to be interested in this aspect much. It is fine not to
> > be interested in paintings or photos or films for their own sake but
> > just for the practical message they communicate.
> >
> > But for many of us who are interested in more than the practical
> > message of many things, aesthetics is important, it is an end in
> > itself.
> >
> > Few good painters are uninterested in the properties of their
> > materials and equipment who are also shy of veering from the
> > instructions and ideas printed on their labels. I can't imagine my
> > life as a keen photographer for so many years without being really
> > interested in how my materials and equipment worked and thinking about
> > how to use them in different ways, both in and out of the darkroom.
>
> But that only affects you.

If I had taken less interest in how to make pictures, my pictures
would have been different. If my pictures had been different, I am
sure the effect on others would have been different too. It is the
same for everyone who makes anything at all.

> Software standards, however, will affect many
> people.
>

So would the interpretations of the standards by the practitioners, so
would the practitioners making do as best as they can with the
limitations of the standards, so would thinking of ways to do things
that are allowed under the standards but not nailed down.

> > Try useful absolute positioning without slapping on 'position:
> > relative' on some container you want to position in relation to. The
> > style is precisely for its side effect.
> >
> > <http://dorayme.netweaver.com.au/abso...earest_positio
> > ned_ancestor.html>
> >
> > Seriously, Tim, CSS is riddled in more ways than you maybe are
> > imagining with the usefulness of "side-effects" even for very
> > practical purposes.
>
> Oh, I can well imagine that. But I thought side effects were, in
> computer science, supposed to be a bad idea. Orthogonality comes to mind.

CSS styling is not programming. Styling in general is not a science.

Your interest in CSS is to style internet software programmes perhaps?
Fair enough.

Your original aim was to have "a fixed area within a table
cell that [you] can write stuff into and which will have a vertical
scroll bar when necessary". The span is fine if *you* style it. And
there are different ways to do this as you have discovered by now.

A div is finer still because someone else has styled it (browsers have
default styles) and you need not and it will not puzzle anyone else
who maintains your goods in the future. But there is no other reason
that I know of to do with some sort of no-side-effects philosophy.

Going back to basics, if you are going to go all direct and no
nonsense, why not forget about any SPAN, DIV or HARRY and simply class
the cell that has the fixed area? Maybe there is a reason, but just
for the record, you can class that cell as "scrollarea" with the CSS
you showed first up and you save on the HTML. And if you feel wobbly
about the float, just change it to display: block;

An interesting question is if all browsers like it:

<http://dorayme.netweaver.com.au/fixedArea.html>

Depending on your purpose and the rest of your page, you can easily
work without even a table.

--
dorayme

In article <dorayme->,
dorayme <> wrote:

> In article <timstreater->,
> Tim Streater <> wrote:
>
> > In article <dorayme->,
> > dorayme <> wrote:
> >
> > > Your idea of "the main business" of web pages and your concept of
> > > being interested in CSS "for its own sake" deserves a comment or two.
> > >
> > > Simple communication and not trying to be too arty about it is a fine
> > > thing. But aesthetics is something that is important to a lot of
> > > people, it makes things interesting and yes, for its own aesthetic
> > > sake. Sometimes the aesthetics is the main point.
> >
> > Then perhaps its about how we define aesthetics.
>
> We don't have to define aesthetics to see that some people make and
> want many things including web pages for reasons other than simple
> communication.
>
> > To me it includes doing
> > things in the most simple, straightforward, and effective way, and from
> > an engineering perspective it should be maintainable too.
>
> No sensible person would disagree. Beyond motherhood though, there are
> different "things" that are done and the "most simple,
> straightforward, and effective way" of doing them can involve an
> awfully fancy lot of footwork behind the scenes, by any objective
> measure of footwork.

Of course. That's why I like coding in PHP/JavaScript - because so much
boring stuff is done for me. I really can't be arsed these days to
fiddle about in C worrying about the best way to concatenate strings. As
long as the giant brain can do that for me reasonable quickly that
suffices.

> > > It is fine not to be interested in this aspect much. It is fine not to
> > > be interested in paintings or photos or films for their own sake but
> > > just for the practical message they communicate.
> > >
> > > But for many of us who are interested in more than the practical
> > > message of many things, aesthetics is important, it is an end in
> > > itself.
> > >
> > > Few good painters are uninterested in the properties of their
> > > materials and equipment who are also shy of veering from the
> > > instructions and ideas printed on their labels. I can't imagine my
> > > life as a keen photographer for so many years without being really
> > > interested in how my materials and equipment worked and thinking about
> > > how to use them in different ways, both in and out of the darkroom.
> >
> > But that only affects you.
>
> If I had taken less interest in how to make pictures, my pictures
> would have been different. If my pictures had been different, I am
> sure the effect on others would have been different too. It is the
> same for everyone who makes anything at all.

That's a second order effect.

> > Software standards, however, will affect many people.
>
> So would the interpretations of the standards by the practitioners, so
> would the practitioners making do as best as they can with the
> limitations of the standards, so would thinking of ways to do things
> that are allowed under the standards but not nailed down.

And these are first order effects.

> > > Try useful absolute positioning without slapping on 'position:
> > > relative' on some container you want to position in relation to. The
> > > style is precisely for its side effect.
> > >
> > > <http://dorayme.netweaver.com.au/abso...earest_positio
> > > ned_ancestor.html>
> > >
> > > Seriously, Tim, CSS is riddled in more ways than you maybe are
> > > imagining with the usefulness of "side-effects" even for very
> > > practical purposes.
> >
> > Oh, I can well imagine that. But I thought side effects were, in
> > computer science, supposed to be a bad idea. Orthogonality comes to mind.
>
> CSS styling is not programming. Styling in general is not a science.
>
> Your interest in CSS is to style internet software programmes perhaps?
> Fair enough.

I have to style in order to present an interface to the user. I have
next to no artistic skills, as such, but I know ugly when I see it, and
I know "bad user interface" when I see it, too.

> Your original aim was to have "a fixed area within a table
> cell that [you] can write stuff into and which will have a vertical
> scroll bar when necessary". The span is fine if *you* style it. And
> there are different ways to do this as you have discovered by now.
>
> A div is finer still because someone else has styled it (browsers have
> default styles) and you need not and it will not puzzle anyone else
> who maintains your goods in the future. But there is no other reason
> that I know of to do with some sort of no-side-effects philosophy.

But in the case of the span/float, that *was* a side-effect, which is
how we got here in the first place. If whoever made that site in the
first place had used a <div> or <span> with display:block I probably
would never have made my original moan. But I thought float? WTF? and as
it turns out to work because of a *side-effect* of float, well, that
offends me.

Another side effect I saw recently involves a simple for-loop in
JavaScript. I would have written it as:

for (j=0; j<maxval; j++)
{
// loop body
}

but that chap, you know, the one who thinks he's the moderator of
comp.lang.javascript, wrote it thus:

for (j=maxval; j--
{
// loop body
}

which is too geeky for words.

> Going back to basics, if you are going to go all direct and no
> nonsense, why not forget about any SPAN, DIV or HARRY and simply class
> the cell that has the fixed area? Maybe there is a reason, but just
> for the record, you can class that cell as "scrollarea" with the CSS
> you showed first up and you save on the HTML. And if you feel wobbly
> about the float, just change it to display: block;

Well quite. But I have bigger fish to fry just now: my 17-year old TV is
packing up and I have to keep the pheasants out of the vegetable patch
(these two are not related).

Meanwhile the reason I needed to style that <td> is stalled at present
while I rethink the database and UI aspects

--
Tim

"That excessive bail ought not to be required, nor excessive fines imposed,
nor cruel and unusual punishments inflicted" -- Bill of Rights 1689

In article <timstreater->,
Tim Streater <> wrote:

> In article <dorayme->,
> dorayme <> wrote:
>
....
> > Your original aim was to have "a fixed area within a table
> > cell that [you] can write stuff into and which will have a vertical
> > scroll bar when necessary". The span is fine if *you* style it. And
> > there are different ways to do this as you have discovered by now.
> >
> > A div is finer still because someone else has styled it (browsers have
> > default styles) and you need not and it will not puzzle anyone else
> > who maintains your goods in the future. But there is no other reason
> > that I know of to do with some sort of no-side-effects philosophy.
>
> But in the case of the span/float, that *was* a side-effect, which is
> how we got here in the first place. If whoever made that site in the
> first place had used a <div> or <span> with display:block I probably
> would never have made my original moan. But I thought float? WTF? and as
> it turns out to work because of a *side-effect* of float, well, that
> offends me.
>

Well, OK, we differ! Why it works *delights* me, it puts a smile on my
face, a spring in my step, I eat a particularly hearty meal on the
nights I use or even hear about the shrink-to-fit or other qualities
of floats.

And I am suspicious of your forensic analysis of side-effects, first
order, second order, nth order... I am inclined to think, "hey,
side-effects, shmide-effects!"

CSS tools are not anywhere near the numbers and types that are
available to the motor mechanic. I remember with admiration and awe a
bloke I knew in Melbourne who was good at fixing anything on old
Buicks: he walked around with a very big side-effect, a hammer! And
was very effective with it for a surprising number of problems. No one
would dare to express any fine reservations about the matter, in spite
of there being lots of more appropriate tools. <g>

....

>
> > Going back to basics, if you are going to go all direct and no
> > nonsense, why not forget about any SPAN, DIV or HARRY and simply class
> > the cell that has the fixed area? Maybe there is a reason, but just
> > for the record, you can class that cell as "scrollarea" with the CSS
> > you showed first up and you save on the HTML. And if you feel wobbly
> > about the float, just change it to display: block;
>
> Well quite. But I have bigger fish to fry just now: my 17-year old TV is
> packing up and I have to keep the pheasants out of the vegetable patch
> (these two are not related).
>

Let's hope they are not related.

I saw a way for making do without a TV in a movie once. It requires
you to have a deaf neighbour with a TV in your line of sight. You sit
in a comfy chair with binocs.

--
dorayme