Say I wanted to put a couple lines of asterisks between paragraphs, and have
it stretch the spaces so that it spanned 100% of the text-width, like this:
* * * * * * * *
Is there a way to do this in CSS? I don't want it to line break, just collapse
the spacing between the stars if the window gets narrower.
--
----------------------------------------------------------------------------
Kim Scarborough http://www.unknown.nu/kim/
----------------------------------------------------------------------------
"Those who 'abjure' violence can only do so because others are committing
violence on their behalf."
-- George Orwell
---------------------------------------------------------------------------- 22  3996 
Kim Scarborough <sl****@unknown.nu> wrote: Say I wanted to put a couple lines of asterisks between paragraphs,
and have it stretch the spaces so that it spanned 100% of the
text-width, - -
Is there a way to do this in CSS?
I don't think so. You could affect the spacing using letter-spacing or
word-spacing properties, but they take length values. I can't see how
we could specify them so that the width is 100%.
But I would suggest some different approach. It seems that you wish to
use decorative divider. There are many approaches, including non-CSS
use of images and various CSS techniques, see e.g. http://ppewww.ph.gla.ac.uk/~flavell/www/hrstyle.html http://www.cs.tut.fi/~jkorpela/html/alt.html#hr
Specifically, if your document content has a row of asterisks separated
by spaces, speech-based user agents will say something odd - unless
they are clever enough to say "twenty asterisks separated by spaces",
which I double. Using either an image (via <img>) or a background image
avoids this problem.
--
Yucca, http://www.cs.tut.fi/~jkorpela/
> Specifically, if your document content has a row of asterisks separated by spaces, speech-based user agents will say something odd - unless
they are clever enough to say "twenty asterisks separated by spaces",
which I doubt. Using either an image (via <img>) or a background image
avoids this problem.
Well, the only reason this is coming up is because I'm trying to do a
reasonably faithful XHTML version of Alice's Adventures in Wonderland (being
displeased for various reasons with the versions currently on the web. Carroll
used rows of asterisks to indicate transitions at various points, and the
typesetters of a given edition will set the number of asterisks to fill
whatever column length they're using. I thought that maybe I could do
something like this as a reasonable equivalent:
SPAN.stretch {text-align: justify; width: 100%}
....
<span class="stretch">* * * * *</span>
But obviously, that doesn't work as I intended.
I suppose I could do a picture of asterisks, but it wouldn't match the font
then. Probably I'll just do a centered <pre> block and not worry about it
stretching out.
--
----------------------------------------------------------------------------
Kim Scarborough http://www.unknown.nu/kim/
----------------------------------------------------------------------------
"Those who 'abjure' violence can only do so because others are committing
violence on their behalf."
-- George Orwell
----------------------------------------------------------------------------
> Kim, if you like mine, you can use it:
http://www.bookstacks.org/carroll/alice/chapters.html
Thanks, but... "what is the use of a book... without pictures"?
--
----------------------------------------------------------------------------
Kim Scarborough http://www.unknown.nu/kim/
----------------------------------------------------------------------------
"Those who 'abjure' violence can only do so because others are committing
violence on their behalf."
-- George Orwell
----------------------------------------------------------------------------
In article <bf**********@bob.news.rcn.net>, Kim Scarborough wrote: Specifically, if your document content has a row of asterisks separated
by spaces, speech-based user agents will say something odd - unless
they are clever enough to say "twenty asterisks separated by spaces",
which I doubt. Using either an image (via <img>) or a background image
avoids this problem.
Also, content property of CSS is handy, but not supported by IE. I would
do it that way anyway.
html > body hr {border:0;}
hr:before {width:80ex;letter-spacing:5ex;text-align:center;content:"* * *
* * *";}
Or something like that.
Well, the only reason this is coming up is because I'm trying to do a
reasonably faithful XHTML version of Alice's Adventures in Wonderland (being
displeased for various reasons with the versions currently on the web. Carroll
used rows of asterisks to indicate transitions at various points, and the
typesetters of a given edition will set the number of asterisks to fill
whatever column length they're using. I thought that maybe I could do
something like this as a reasonable equivalent:
But, you are doing it on WWW, not for book. And I bet Carrol used
asterisk because her typewriter didn't have any better for that.
SPAN.stretch {text-align: justify; width: 100%}
...
<span class="stretch">* * * * *</span>
But obviously, that doesn't work as I intended.
I suppose I could do a picture of asterisks, but it wouldn't match the font
then. Probably I'll just do a centered <pre> block and not worry about it
stretching out.
Pre block would not be good, as it won't use normal font. You can specify
that, but I don't it helps any.
Something to try, don't work as well on IE as in mozilla and opera:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title>Test case </title>
<style type="text/css">
div {width:100%;letter-spacing:2em;
text-align:center;height:1em;overflow:hidden;display:ta ble;}
body > div {letter-spacing:normal;}
span {display:table-cell;text-align:center;}
</style>
<div><span>*</span><span>*</span><span>*</span><span>*</span>
<span>*</span><span>*</span></div>
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.
> Kim, if you like mine, you can use it:
http://www.bookstacks.org/carroll/alice/chapters.html
Actually, to revisit this a bit more on-topic-ish:
You're dealing with Carroll's special formatting of poems, the mouse's tale,
and the address of Alice's foot by use of <pre> tags, as every HTML version
I've seen does. I don't want to do it this way, because the sudden switch to a
monospace font is jarring, and, more importantly, you have to guess at the
browser width. The goal is to have those blocks centered, but if you're using
<pre>, you can only make them X characters away from the left.
Here's how I'm dealing with it currently (I haven't gotten to the mouse's tail
yet):
P.poem {padding-left: 40%; white-space: pre; font-style: italic; clear: both}
....
<p class="poem">
Alice's Right Foot, Esq.
Hearthrug,
near the Fender,
(with Alice's love.)
</p>
(not that that's a poem, but I'll mainly be using this style for the poems.)
This isn't optimal, but it's the best I've got so far. The 40% from the left
will ensure that it appears roughly near the center, and the white-space will
keep Caroll's formatting.
My big gripe with it is the "clear: both", which I've put in to avoid having
the overlap floating images. It makes for big vertical whitespaces before
poems, which is ugly. Haven't found a better solution yet.
I guess what I want is to specify a box containing some text, center that box
relative to whatever images are there, have the box's width be no wider than
the longest text line in the box, and have the text left-justified and
pre-formatted *inside the box*. Does that make sense?
--
----------------------------------------------------------------------------
Kim Scarborough http://www.unknown.nu/kim/
----------------------------------------------------------------------------
"Those who 'abjure' violence can only do so because others are committing
violence on their behalf."
-- George Orwell
----------------------------------------------------------------------------
On Sat, 19 Jul 2003 17:47:35 -0500, Kim Scarborough
<sl****@unknown.nu> wrote: You're dealing with Carroll's special formatting of poems, the mouse's tale,
and the address of Alice's foot by use of <pre> tags, as every HTML version
I've seen does.
Well, if you find an answer, let me know (if you're willing to share
it, of course.) One of my volunteers did that book, and, not wanting
to spend much time on it (since that's why I let someone else do it),
I just fixed a few errors and left it as is.
Ian
-- http://www.aspipes.org/ http://www.bookstacks.org/
On Sat, 19 Jul 2003 17:12:31 -0500, Kim Scarborough
<sl****@unknown.nu> wrote: Thanks, but... "what is the use of a book... without pictures"?
Actually, if you find some public domain illustrations for Alice, and
you'd be willing to share your find, let me know. I'm doing Anna
Karenina right now, and won't be going back to that book at all, sad
to say. (Not that I really worked on it anyway. My buddy Chris (from
the "Axis of Ians") did all the work.)
Ian
-- http://www.aspipes.org/ http://www.bookstacks.org/
Kim Scarborough <sl****@unknown.nu> wrote: I suppose I could do a picture of asterisks, but it wouldn't match the font
then.
Why should it?
Probably I'll just do a centered <pre> block and not worry about it
stretching out.
The asterisk's are decoration, not content. Follow Jukka's advice, it's
the only way to do this properly.
Headless
In article <bf**********@bob.news.rcn.net> in
comp.infosystems. www.authoring.stylesheets, Kim Scarborough
<sl****@unknown.nu> wrote: Well, the only reason this is coming up is because I'm trying to do a
reasonably faithful XHTML version of Alice's Adventures in Wonderland (being
displeased for various reasons with the versions currently on the web. Carroll
used rows of asterisks to indicate transitions at various points,
Did Carroll use them, or did his printer select them? I rather
suspect this varies between editions, so you are free to choose
anything you like.
In my edition /The Annotated Alice/, the first transition I happened
to see just now was near the end of "It's My Own Invention" and
looked like this:
* * * * *
* * * *
* * * * *
a total of fourteen asterisks in a 5-4-5 arrangement.
--
Stan Brown, Oak Road Systems, Cortland 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/
validator: http://jigsaw.w3.org/css-validator/
In article <bf**********@bob.news.rcn.net>, sl****@unknown.nu says... Say I wanted to put a couple lines of asterisks between paragraphs, and have
it stretch the spaces so that it spanned 100% of the text-width, like this:
* * * * * * * *
Is there a way to do this in CSS? I don't want it to line break, just collapse
the spacing between the stars if the window gets narrower.
Further to other suggestions, would something simple like: http://porjes.com/alice.html
do?
Kim Scarborough <sl****@unknown.nu> wrote in message
news:<bf**********@bob.news.rcn.net>... Say I wanted to put a couple lines of asterisks between paragraphs, and have
it stretch the spaces so that it spanned 100% of the text-width, like this:
* * * * * * * *
Is there a way to do this in CSS? I don't want it to line break, just collapse
the spacing between the stars if the window gets narrower.
Here's another idea. This one has obvious accessibility and degradability
issues, but maybe you'll get a good idea out of it:
<Div style="word-spacing:3em; text-align:center;
width:100%; height:1em; overflow:hidden;">
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
</Div>
Kim Scarborough tat kund: Say I wanted to put a couple lines of asterisks between paragraphs, and
have it stretch the spaces so that it spanned 100% of the text-width,
like this:
* * * * * * * *
Is there a way to do this in CSS?
<div class="asteriks"><b></b><b></b><b></b>
<b></b><b></b><b></b><b></b><b></b></div>
..asteriks b {
float:left;
display:block; /* Mozilla needs some redundance... */
width:12.5%;
height: 20px;
background: url(/img/asteriks.gif) center center transparent;
}
Not even nice markup, but slim and without any harm for blind users. :)
Thomas
Headless wrote: Stan Brown <th************@fastmail.fm> wrote:
The asterisk's are decoration, not content.
http://www.angryflower.com/worlds.gif
Pardon?
I think it's a comment on the use of the apostrophe in "asterisk's"
--
PeterMcC
If you feel that any of the above is incorrect,
inappropriate or offensive in any way,
please ignore it and accept my apologies.
Headless <in*************@dna.ie> wrote: spell checker
Bother, spelling checker ;-)
Headless
"Stan Brown" <th************@fastmail.fm> wrote in message
news:MP***********************@news.odyssey.net... In article <bf**********@bob.news.rcn.net> in
comp.infosystems.www.authoring.stylesheets, Kim Scarborough
<sl****@unknown.nu> wrote:Well, the only reason this is coming up is because I'm trying to do a
reasonably faithful XHTML version of Alice's Adventures in Wonderland
(beingdispleased for various reasons with the versions currently on the web.
Carrollused rows of asterisks to indicate transitions at various points,
Did Carroll use them, or did his printer select them? I rather
suspect this varies between editions, so you are free to choose
anything you like.
In my edition /The Annotated Alice/, the first transition I happened
to see just now was near the end of "It's My Own Invention" and
looked like this:
* * * * *
* * * *
* * * * *
a total of fourteen asterisks in a 5-4-5 arrangement.
In the Modern Library edition (the low-cost solution),
they use large dots instead of asterisks.
The number varies -- sometimes 5-4-5, sometimes 6-5-6.
In Through the Lookinglass, there is a transition every time
she goes from one row of the chess board to another.
In Wonderland, the transitions are pseudo-random: there is one
when she eats the mushroom, and maybe two more that I can see
on a quick scan.
You could find a copy of the original manuscript to count the actual
asterisks (or dots). But it appears that *real* publishers don't
worry about things like this.
My vote: declare it tabular data.
P.S.
"(I haven't gotten to the mouse's tail yet)"
I would have started there. That's the fun part.
--
Steve
"Steven Dilley" <st***********@compuware.com> wrote: In Through the Lookinglass, there is a transition every time
she goes from one row of the chess board to another.
In Wonderland, the transitions are pseudo-random
But in any case, the asterisk patterns, or whatever, _mean_ something.
They are not textual content, but they indicate transitions. There's
really only one HTML construct that corresponds to this meaning at all,
namely <hr>, which was originally defined as meaning 'change of topic'
but named after 'horizontal rule' - with an accompanying statement
saying that speech browsers could render it as a pause. It's not
optimal markup of course, but the best we can do, and in non-CSS
browsing situations, it gives _some_ indication of some major division
point.
Thus, the correct CSS question is IMHO: How do I style an <hr> element
so that instead of a horizontal line, a pattern of asterisk symbols (or
something like that) appears?
An obvious (?) approach is to create the symbol pattern as an image and
use something like
hr { display: block;
height: 50px;
width: 100%;
background: url(stars.gif) center center no-repeat;
border: none; }
But there are at least two problems:
1. IE seems to draw a border still. Maybe due to the idiosyncracies of
<hr> implementation.
2. When images are not displayed (including many printing situations),
nothing appears except empty spacing.
However, problem 1 partly solves problem 2, since the bordered box
probably conveys some idea of a major division point. :-)
--
Yucca, http://www.cs.tut.fi/~jkorpela/
In article <7v********************************@4ax.com>, Ian Rastall <id*******@earthlink.net> writes: On Sat, 19 Jul 2003 17:12:31 -0500, Kim Scarborough <sl****@unknown.nu> wrote:
http://www.bookstacks.org/carroll/alice/chapters.html
Thanks, but... "what is the use of a book... without pictures"?
I don't know. Because the pics might be copyrighted?
Tenniel's pictures are long out of copyright. (You did realize that
sluggo was quoting the first chapter of _Alice in Wonderland_, didn't you?)
--
Michael F. Stemper
#include <Standard_Disclaimer>
Visualize whirled peas!
In article <MP************************@news.cis.dfn.de>, la***@raittila.cjb.net says... In article <20***********************@mickey.empros.com>, Michael Stemper
wrote:But, you are doing it on WWW, not for book. And I bet Carrol used
asterisk because her typewriter didn't have any better for that.
When Lewis Carroll wrote _Alice in Wonderland_ in
1865, *he* did not have a typewriter. The reason that *he* did not have
a typewriter is that it was a few years before its invention. (Sholes
patented it in 1868.)
So, makes even more likely that use of asterisk was because there was no
better? I think that at that time there were no printing machines that
would have had better, whitout great problems? Not that I know if
printing machines had asterisk then either.
Certainly - if you look at a good edition of Tristram Shandy (1759)
you'll find all sorts of typographical trickery . This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: Steve |
last post by:
I'd like to create a form where required fields are marked by
asterisks. The asterisks would then disappear as the field or
checkbox is filled in by the user.
If there's a way to do this with...
|
by: Yuancai \(Charlie\) Ye |
last post by:
Hi, All:
I am happy to annouce that we have formally released our latest SocketPro
version 4 at www.udaparts.com, an advanced remoting framework written from
batching/queue, asynchrony and...
|
by: yawnmoth |
last post by:
in firefox, long strings without spaces cause a horozontal scrollbar to
appear at the bottom of any given textarea. for example, if your
textarea supports 50 characters, and 100 consecutive...
|
by: Raed Sawalha |
last post by:
I read in MSDN an examples for Image Stretching but something I can not
understand is this line
e.Graphics.DrawImage(newImage, destRect1, x, y, width, height, units);
what is e in all example they...
|
by: sri2097 |
last post by:
Hi all,This is in reply to the 'Compressing folders in Windows using
Python' query I raised y'day.
I figured out that windows does not allow command line zipping so I
started looking for...
|
by: Arthur Dent |
last post by:
Hello all... i have a really frsutrating problem here...
This is only happening in IE (6 & 7b2), Mozilla and Netscape are both OK.
I have a top-level table with a width of 760px, so it should be...
|
by: Kahlia |
last post by:
Hi. I am trying to print a pyramid of asterisks using recursion so that the recursive function takes in an integer and prints that number of lines of asterisks and then reverses, eg:
*
...
|
by: D.M. Procida |
last post by:
In music (apparently) when listing a composer's compositions, a single
asterisk against a performance item denotes that it is a premiere (i.e.
in that country), and two asterisks that it is a world...
|
by: Ali Rizwan |
last post by:
Hi all,
I m stretching my form and i want if i stretch its position after stretching must be in middle of screen or i want to stretch centerly.
Thanx
>> ALI <<
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
| |
