shrinkable/expandable layout with CSS?

[Don Li]

Honestly have not touched CSS for years, so, back to square one on
this...

What I'd like to do if possible with CSS is this:
create a layout that is shrinkable or expandable when a user drag it,
kind of like a window on a desktop, you can drag it to make it bigger
or smaller... so, the content within would also be proportionally
shrunk or expanded...

Is it possible with CSS? If so, could you show an example?

Thanks.
P.S. I've searched this NG and googled for it to no avail.

[Felix Miata]

On 2007/11/23 15:56 (GMT-0800) Don Li apparently typed:

Honestly have not touched CSS for years, so, back to square one on
this...

What I'd like to do if possible with CSS is this:
create a layout that is shrinkable or expandable when a user drag it,
kind of like a window on a desktop, you can drag it to make it bigger
or smaller... so, the content within would also be proportionally
shrunk or expanded...

Is it possible with CSS? If so, could you show an example?

Thanks.
P.S. I've searched this NG and googled for it to no avail.

I don't know why anyone would think it a good idea. I think it's really dumb
for objects like text and images to vary in size depending on window size.
You could use percentages to size images and containers, but percentages for
fonts apply based upon ancestor font sizes, not container sizes. You'd have
to use something other than CSS for them, like this example:
http://nickcowie.com/ . Note there if your zoom or default font size is more
than nominally larger than about 16px, no matter the window size, it has a
horizontal scrollbar.

What's wrong with sizing based upon font size? That way, with care, you can
maintain good proportions within reasonable ranges of window sizes, as here:
http://mrmazda.no-ip.com/auth/Sites/ksc/
--
" A patriot without religion . . . is as great a
paradox, as an honest man without the fear of God."
John Adams

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

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

[dorayme]

In article
<8d**********************************@d61g2000hsa. googlegroups.co
m>,
Don Li <ta********@gmail.comwrote:

Honestly have not touched CSS for years, so, back to square one on
this...

What I'd like to do if possible with CSS is this:
create a layout that is shrinkable or expandable when a user drag it,
kind of like a window on a desktop, you can drag it to make it bigger
or smaller... so, the content within would also be proportionally
shrunk or expanded...

Is it possible with CSS? If so, could you show an example?

This shrinks and expands with the window of the browser:

http://tinyurl.com/ysz65b

Want anything more fancy? Tell me exactly what you want and I
will go into the dorayme factory and see what can be found for
you.

--
dorayme

[dorayme]

In article <13*************@corp.supernews.com>,
Felix Miata <Ug********************@dev.nulwrote:

I think it's really dumb
for objects like text and images to vary in size depending on window size.

It is not "really dumb" to ever want this for images.
Unfortunately, it cannot be done well across platforms and
browsers. It can be done well up to a reasonable point on Macs on
good browsers like Safari and FF.

--
dorayme

[Don Li]

Do not assume why there's such a need/rationale for it, there's tons
and tons of things you do not know in the world.

It appears that you failed to understand my post (so did the other
one). Let me use an HTML example to further explain it.
<TABLE>
<tr>
<td>Main Component</td>
<td>
<table><tr><td>subcomponent a </td></tr></table>
</td>
</tr>
</TABLE>

Let's say, the inner table currently takes about 25% width of the
current screen (the content within the inner table is readable), now,
suppose, I want more real estate for other use for the current screen,
so, if I can shrink the inner table to,s ay, 5% width of the current
screen, that would be desirable. With a desktop window, one can drag
to be BIGGER or smaller, not HTML, nor CSS? That's the question I
was asking! Your answer would be "yes, CSS can do that, and here's
how" or "No, CSS can't" as simple as that, no SB!!

Another option would be, visible attribute but less desirble...

>On Nov 23, 7:25 pm, Felix Miata <[e-mail]:
On 2007/11/23 15:56 (GMT-0800) Don Li apparently typed:

Honestly have not touched CSS for years, so, back to square one on
this...
What I'd like to do if possible with CSS is this:
create a layout that is shrinkable or expandable when a user drag it,
kind of like a window on a desktop, you can drag it to make it bigger
or smaller... so, the content within would also be proportionally
shrunk or expanded...
Is it possible with CSS? If so, could you show an example?
Thanks.
P.S. I've searched this NG and googled for it to no avail.

I don't know why anyone would think it a good idea. I think it's really dumb
for objects like text and images to vary in size depending on window size.
You could use percentages to size images and containers, but percentages for
fonts apply based upon ancestor font sizes, not container sizes. You'd have
to use something other than CSS for them, like this example:http://nickcowie.com/. Note there if your zoom or default font size is more
than nominally larger than about 16px, no matter the window size, it has a
horizontal scrollbar.

What's wrong with sizing based upon font size? That way, with care, you can
maintain good proportions within reasonable ranges of window sizes, as here:http://mrmazda.no-ip.com/auth/Sites/ksc/
--
" A patriot without religion . . . is as great a
paradox, as an honest man without the fear of God."
John Adams

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

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

[VK]

On Nov 24, 4:26 am, Don Li <[e-mail]:

<TABLE>
<tr>
<td>Main Component</td>
<td>
<table><tr><td>subcomponent a </td></tr></table>
</td>
</tr>
</TABLE>

Let's say, the inner table currently takes about 25% width of the
current screen (the content within the inner table is readable), now,
suppose, I want more real estate for other use for the current screen,
so, if I can shrink the inner table to,s ay, 5% width of the current
screen, that would be desirable. With a desktop window, one can drag
to be BIGGER or smaller, not HTML, nor CSS? That's the question I
was asking! Your answer would be "yes, CSS can do that, and here's
how" or "No, CSS can't" as simple as that, no SB!!

Yes, CSS has tools one can interface with to drag/resize particular
content blocks on the display.

No, CSS by itself has no necessary tools to monitor drag/drop mouse
events and to change CSS rules accordingly. CSS is not a Turing-
complete language, other words it is a non-computational language or
even more simple it is not a programming language.

You may write your own binding/behavior pair to bind it to the
necessary block over CSS rule (-moz-binding, behavior) but it is just
another way around of using a real programming language - JavaScript -
for the task.

[Don Li]

On Nov 24, 6:53 am, VK <[e-mail]:

On Nov 24, 4:26 am, Don Li <[e-mail]:

<TABLE>
<tr>
<td>Main Component</td>
<td>
<table><tr><td>subcomponent a </td></tr></table>
</td>
</tr>
</TABLE>

Let's say, the inner table currently takes about 25% width of the
current screen (the content within the inner table is readable), now,
suppose, I want more real estate for other use for the current screen,
so, if I can shrink the inner table to,s ay, 5% width of the current
screen, that would be desirable. With a desktop window, one can drag
to be BIGGER or smaller, not HTML, nor CSS? That's the question I
was asking! Your answer would be "yes, CSS can do that, and here's
how" or "No, CSS can't" as simple as that, no SB!!

Yes, CSS has tools one can interface with to drag/resize particular
content blocks on the display.

No, CSS by itself has no necessary tools to monitor drag/drop mouse
events and to change CSS rules accordingly. CSS is not a Turing-
complete language, other words it is a non-computational language or
even more simple it is not a programming language.

You may write your own binding/behavior pair to bind it to the
necessary block over CSS rule (-moz-binding, behavior) but it is just
another way around of using a real programming language - JavaScript -
for the task.- Hide quoted text -

- Show quoted text -

Thank you.

[Harlan Messinger]

Don Li wrote:

Honestly have not touched CSS for years, so, back to square one on
this...

What I'd like to do if possible with CSS is this:
create a layout that is shrinkable or expandable when a user drag it,
kind of like a window on a desktop, you can drag it to make it bigger
or smaller... so, the content within would also be proportionally
shrunk or expanded...

Is it possible with CSS? If so, could you show an example?

No, you need Javascript. The only dynamic styling available solely
through CSS (pseudo-classes for links) relates to the current state--is
the element being activated *now*, does the element have the focus
*now*? There isn't any persistence.

[Nik Coughlin]

"Don Li" <ta********@gmail.comwrote in message
news:8d**********************************@d61g2000 hsa.googlegroups.com...

Honestly have not touched CSS for years, so, back to square one on
this...

What I'd like to do if possible with CSS is this:
create a layout that is shrinkable or expandable when a user drag it,
kind of like a window on a desktop, you can drag it to make it bigger
or smaller... so, the content within would also be proportionally
shrunk or expanded...

Is it possible with CSS? If so, could you show an example?

Thanks.
P.S. I've searched this NG and googled for it to no avail.

Do you mean like this?

http://nrkn.com/overview.html

Or do you mean by content shrinking or expanding, that when you resize the
window, the font-size changes too?