- From: Ian Hickson <ianh@netscape.com>
- Date: Thu, 5 Oct 2000 16:27:21 -0700 (Pacific Daylight Time)
- To: Tobias Burnus <burnus@gmx.de>
- cc: www-style@w3.org, Bert Bos <Bert.Bos@sophia.inria.fr>
On Fri, 29 Sep 2000, Tobias Burnus wrote:
>
> I miss something like this:
>
>
> #############
> #############
> #############
> #############
> ###### ++++ <!-- if there is enough space -->
>
> or
>
> #############
> #############
> #############
> #############
> ######### <!-- if there isn't -->
> ++++
>
> This would be a kind of "display: run-out;" tag.
>
> At least according to news:comp.infosystems.www.authoring.stylesheets
> this is not yet possible and I haven't found anything in CSS 2 or 3.
> It would be great if this would make it into CSS3/XSL.
You can already do this. Just put your '+++' into an element that you
float right with white-space:nowrap. If you want to make sure that
backgrounds or borders on the element containing the '###' and '+++' text
also go around the '+++' text then add a dummy empty element after the
'+++' text that has 'display:block;clear:both;' set.
e.g.:
<p>
# # # # # # # # # # # # # # # # # # # # # # # # # # #
# # # # # # # # # # # # # # # # # # # # # # # # # # #
# # # # <span>+ + + +</span> <span><span>
</p>
...with the style:
p { border: solid; }
span { float: right; white-space: none; }
span + span { float: none; clear: both; display: block; }
This assumes:
1. The '+++' will never be wider than the containing block.
2. The UA floats elements as high as possible. [1]
3. The UA defined minimum width is the shrink wrap width.
[1] Mozilla doesn't, and so fails to show this properly. Bug 50630.
--
Ian Hickson )\ _. - ._.) fL
Netscape, Standards Compliance QA /. `- ' ( `--'
+1 650 937 6593 `- , ) - > ) \
irc.mozilla.org:Hixie _________________________ (.' \) (.' -' __________
Received on Thursday, 5 October 2000 19:28:40 UTC