I wonder if there's a way with HTML4 + CSS1 to create boxed text. I mean
content that isn't directly related to the topic of dicussion, but is
still useful to know. Take this example:

---8<------------------------------------
A paragraph...

+----------------------+
| TITLE |
| By the way... |
| |
| And furthermore... |
+----------------------+

And now back to our discussion...
---8<------------------------------------

It's tricky to get the linebreaks right. No linebreak before or after
the title, and no linebreak after the last paragraph in the box. Am I
asking too much? :-)

Gustaf

Gustaf Liljegren wrote:
[color=blue]
> I wonder if there's a way with HTML4 + CSS1 to create boxed
> text. I mean content that isn't directly related to the
> topic of dicussion, but is still useful to know. Take this
> example:
>
> ---8<------------------------------------
> A paragraph...
>
> +----------------------+
>| TITLE |
>| By the way... |
>| |
>| And furthermore... |
> +----------------------+
>
> And now back to our discussion...
> ---8<------------------------------------
>
> It's tricky to get the linebreaks right. No linebreak
> before or after the title, and no linebreak after the last
> paragraph in the box. Am I asking too much? :-)[/color]

Are you looking for

<blockquote>
<h1>TITLE</h1>
<p>
By the way..
</p>
<p>
And furthermore...
</p>
</blockquote>

?

If you still get to much space before the title or after the
last paragraph, you could add to the CSS:
blockquote h1 {margin-top:0;}
blockquote p {margin-top:1em;margin-bottom:0;}

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

Gustaf Liljegren wrote:
[color=blue]
> I wonder if there's a way with HTML4 + CSS1 to create boxed text. I mean
> content that isn't directly related to the topic of dicussion, but is
> still useful to know. Take this example:
>
> ---8<------------------------------------
> A paragraph...
>
> +----------------------+
> | TITLE |
> | By the way... |
> | |
> | And furthermore... |
> +----------------------+
>
> And now back to our discussion...
> ---8<------------------------------------
>
> It's tricky to get the linebreaks right. No linebreak before or after
> the title, and no linebreak after the last paragraph in the box. Am I
> asking too much? :-)[/color]

Those gaps you're referring to are not linebreaks, but padding and/or
margins.

Here's my example of what you want. The box is a bit cramped, but you
could easily apply some padding to it. I just wanted to show what could
be done.

http://tranchant.plus.com/tmp/boxedtext

--
Mark.

Mark Tranchant wrote:[color=blue]
> Gustaf Liljegren wrote:
>[color=green]
>> I wonder if there's a way with HTML4 + CSS1 to create boxed text. I
>> mean content that isn't directly related to the topic of dicussion,
>> but is still useful to know. Take this example:
>>
>> ---8<------------------------------------
>> A paragraph...
>>
>> +----------------------+
>> | TITLE |
>> | By the way... |
>> | |
>> | And furthermore... |
>> +----------------------+
>>
>> And now back to our discussion...
>> ---8<------------------------------------
>>
>> It's tricky to get the linebreaks right. No linebreak before or after
>> the title, and no linebreak after the last paragraph in the box. Am I
>> asking too much? :-)[/color]
>
>
> Those gaps you're referring to are not linebreaks, but padding and/or
> margins.
>
> Here's my example of what you want. The box is a bit cramped, but you
> could easily apply some padding to it. I just wanted to show what could
> be done.
>
> http://tranchant.plus.com/tmp/boxedtext[/color]

Tinned pears? I just lost my appetite!


Matthias

Mark Tranchant wrote:
[color=blue]
> http://tranchant.plus.com/tmp/boxedtext[/color]

Sounds like a good recipe too :-)

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

Matthias Gutfeldt wrote:
[color=blue][color=green]
>> http://tranchant.plus.com/tmp/boxedtext[/color]
>
> Tinned pears? I just lost my appetite![/color]

It's a lot better than tinned strawberries ;-)

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

Els wrote:[color=blue]
> Matthias Gutfeldt wrote:
>
>[color=green][color=darkred]
>>>http://tranchant.plus.com/tmp/boxedtext[/color]
>>
>>Tinned pears? I just lost my appetite![/color]
>
>
> It's a lot better than tinned strawberries ;-)[/color]

Ewwww. Please stop, or I'll lose my lunch!


Matthias

Els wrote:[color=blue]
> Mark Tranchant wrote:
>
>[color=green]
>>http://tranchant.plus.com/tmp/boxedtext[/color]
>
>
> Sounds like a good recipe too :-)
>[/color]
Take the pears and stuff them with tuna (out of a can with oil)
Delicious. Can also be done with peaches (out of the can)!
Peter

--



Het Digit@@l Café is een initiatief van de Stichting Welzijn
Ouderen Aalsmeer (SWOA)

"Mark Tranchant" <mark@tranchant.plus.com> wrote in
comp.infosystems.www.authoring.html:
[color=blue]
>Here's my example of what you want. The box is a bit cramped, but you
>could easily apply some padding to it. I just wanted to show what could
>be done.
>
>http://tranchant.plus.com/tmp/boxedtext[/color]

Understanding you just implemented what the OP seemed to be asking
for, shouldn't that box be out of the normal flow. Logically if it'd
not part of the main discussion it shouldn't interrupt the main
discussion.

The traditional print way to do this is a sidebar or a footnote.
Footnotes are dreadful because careful readers tend to seek them out
and lose the thread of the main text, but sidebars are rather good
because they're off to the side. Your eyes can flick at them between
paragraphs of the main text, and you either read them or not.

--
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 spec: http://www.w3.org/TR/REC-CSS2/
2.1 changes: http://www.w3.org/TR/CSS21/changes.html
validator: http://jigsaw.w3.org/css-validator/

Els wrote:
[color=blue]
> Gustaf Liljegren wrote:
>[color=green]
>> I wonder if there's a way with HTML4 + CSS1 to create boxed
>> text. I mean content that isn't directly related to the
>> topic of dicussion, but is still useful to know. Take this
>> example:
>>
>> ---8<------------------------------------
>> A paragraph...
>>
>> +----------------------+
>>| TITLE |
>>| By the way... |
>>| |
>>| And furthermore... |
>> +----------------------+
>>
>> And now back to our discussion...
>> ---8<------------------------------------
>>
>> It's tricky to get the linebreaks right. No linebreak
>> before or after the title, and no linebreak after the last
>> paragraph in the box. Am I asking too much? :-)[/color]
>
> Are you looking for
>
> <blockquote>[/color]
[...]

Nothing the OP said stated that this was a block quotation. Therefore
<blockquote> is not the answer.

--
Shawn K. Quinn

Shawn K. Quinn wrote:[color=blue]
> Els wrote:[color=green]
>>Are you looking for
>>
>><blockquote>[/color]
>
> [...]
>
> Nothing the OP said stated that this was a block quotation. Therefore
> <blockquote> is not the answer.[/color]

.... and the answer is?


Matthias

Peter Smit wrote:
[color=blue]
> Els wrote:[color=green]
>> Mark Tranchant wrote:
>>
>>[color=darkred]
>>>http://tranchant.plus.com/tmp/boxedtext[/color]
>>
>>
>> Sounds like a good recipe too :-)
>>[/color]
> Take the pears and stuff them with tuna (out of a can with
> oil) Delicious. Can also be done with peaches (out of the
> can)! Peter[/color]

Hmmm... now I think I have to share Matthias' opinion...
My curiosity might win though.. :S

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

Stan Brown <the_stan_brown@fastmail.fm> wrote:
[color=blue][color=green]
>>http://tranchant.plus.com/tmp/boxedtext[/color]
>
> Understanding you just implemented what the OP seemed to be asking
> for, shouldn't that box be out of the normal flow. Logically if it'd
> not part of the main discussion it shouldn't interrupt the main
> discussion.[/color]

Indeed. If you just have a paragraph with borders, the natural assumption
is that this is a hightlighted paragraph in normal flow rather than a
digression. Setting float: right and some reasonable width (such as
15em) plus some margins should take care of this.

Moreover, using a different font, and maybe even reduced font size like
90%, might contribute to conveying the idea of a side note. But this is
basically CSS, not HTML.

It is possible to create a floated paragraph in pure (though not
Puristic) HTML as well, e.g.

<table align="right" cellspacing="8" cellpadding="6"
summary="This table contains a side note about foobar."
width="300" border="1">
<tr><td>Lorem ipsum - -.</td></tr>
</table>

This is unnecessarily tricky and inflexible, so this was basically just
my ObHTML this time. :-)

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

Am Mon, 12 Jul 2004 um 14:38 GMT hat Matthias Gutfeldt geschrieben:
[color=blue]
> ... and the answer is?[/color]

Why not using:
<div style="width:20%; border:3px double #dddddd;
background-color:#eeeeee; float:left; margin-right:5pt;">
blabla - boxed Text
</div>
Place main text here. Foo.... more foo.... even more....


If you do not want the box to be inside the main text just leave
the float-part of the style definition away.

--
(^^\/\/^^)
~~~@@~~~ PGP key available
(..)