473,396 Members | 1,970 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,396 software developers and data experts.

2-col with a floating quote between them

I'm trying to recreate the layout of a newsletter (produced by an OTS
page-layout application) that is basically a 2-column design with a
quotation in a box that floats between the 2 columns.

You can see the basic design here:

http://www.sparrow-hawk.org/2-col.png

The closest I've come is real kludgy:

#left {
position: absolute ;
top: 50px ;
left: 10px ;
width: 300px ;
}
#right {
position: absolute ;
top: 50px ;
left: 350px ;
width: 300px ;
}
#quoteLeft {
margin-left: -70px ;
margin-right: 20px ;
margin-top: 20px ;
margin-bottom: 20px ;
width: 100px ;
float: left ;
border-top: solid 1px black ;
border-bottom: solid 1px black ;
}
#quoteRight {
margin-right: -70px ;
margin-top: 20px ;
margin-bottom: 20px ;
width: 100px ;
float: right ;
border-top: solid 1px black ;
border-bottom: solid 1px black ;
}

<div id='left'>
blah, blah, blah
<div id='quoteLeft'>isn't this cool</div>
blah, blah, blah
</div>

<div id='right'>
blah, blah, blah
<div id='quoteRight'>isn't this cool</div>
blah, blah, blah
</div>

That is, a div for each of the 2 columns of text, each of which
contains a div for the quote that is has margins set to offset it
correctly and floated left/right accordingly.

This "works" but is very fragile and can easily break with changes in
font size, etc. I'm sure there's got to be a "right" way to do this.
Can anyone help?

pvb
Jul 20 '05 #1
8 2245
paul.v.biron wrote:
I'm trying to recreate the layout of a newsletter
(produced by an OTS page-layout application) that is
basically a 2-column design with a quotation in a box
that floats between the 2 columns.


I hope you'll find this article interesting:

http://member.newsguy.com/~jrexon/handwriting.htm

Regards,
--
Juanra || http://html.conclase.net/
Jul 20 '05 #2
Stephen Poley <sb*****@xs4all.nl> wrote:
I would only recommend PDF for special
cases when you know that a lot of readers (or certain important readers)
will want to print the document.


What's wrong with printing HTML?
Headless

--
Email and usenet filter list: http://www.headless.dna.ie/usenet.htm
Jul 20 '05 #3
In article <i3********************************@4ax.com>, Headless wrote:
Stephen Poley <sb*****@xs4all.nl> wrote:
I would only recommend PDF for special
cases when you know that a lot of readers (or certain important readers)
will want to print the document.


What's wrong with printing HTML?


It takes more time to print HTML exactly as intended, on browser end.
For example I had to fight about 15 minutes to get
http://www.student.oulu.fi/~atlas/hallitus/jasenet.html
fit one A4 when printing with IE6. Have it been available as PDF, it
wouldn't have taken much time. (By default it would have printed it very
strangely, missing most of content while using lots of pages.)

Also, PDF form is good for long enaugh stuff to need index/toc. There is
no way to have page numbers in toc using HTML.

If document is just plain text, there is usually no reason to use PDF.

--
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.

Jul 20 '05 #4
In article <ok********************************@4ax.com>, Headless wrote:
Lauri Raittila <la***@raittila.cjb.net> wrote:
What's wrong with printing HTML?


It takes more time to print HTML exactly as intended, on browser end.


You cannot control on what size of paper a user will want to print,


Of course not. But I can guess, and much better than with window size.

The difference here is that alternative version for most used paper size
is _sometimes_ worth effort, as there is limited number of paper sizes
commonly used, and there is limitations in paper that are impossible to
overcome when printing HTML.

You can also avoid single lines on new pages, images/tables that are
broken to two pages etc that don't happen in continous media. (CSS to
control for them don't work.)
For example I had to fight about 15 minutes to get
http://www.student.oulu.fi/~atlas/hallitus/jasenet.html
fit one A4 when printing with IE6.


Dumb idea. What if the user wants to print on A5, or A3?


As I said, I did that in _browser end_. Meaning, I was printing it. Have
it been available in PDF it would have been easy task to print it. (But I
would have needed to make it available as PDF.)

And, having alternative PDF version for printing will not prevent from
printing HTML version. Of course I would never have PDF linked to be
automatic alternative for printing, as that would confuse user,
especially if acrobat reader wouldn't be installed.
Also, PDF form is good for long enaugh stuff to need index/toc. There is
no way to have page numbers in toc using HTML.


CSS2 spec, paged media section.


Sure you can have page numbers. But can you have the same page numbers in
toc? References to certain pages instead of links? No, you can't. That
was what I meaned. Table of contents is pretty useless if there is
neither links to sections, or page numbers. (Of course you can try force
fontsize, margins etc, but that will not work, and takes lots of time.)

Other thing is that there is no working way to print tables etc landscape
from webpage. The CSS that should do that only works in Opera 6.00 - 6.04
print _preview_ AFAIK.
--
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.

Jul 20 '05 #5
Lauri Raittila <la***@raittila.cjb.net> wrote:
As I said, I did that in _browser end_.
Learn to write English (really), the above is gobbledygook.
>Also, PDF form is good for long enaugh stuff to need index/toc. There is
>no way to have page numbers in toc using HTML.


CSS2 spec, paged media section.


Sure you can have page numbers. But can you have the same page numbers in
toc? References to certain pages instead of links? No, you can't.


Sure you can, as long as you don't' expect the page numbers to match the
number of pages, but that's pointless anyway. A TOC with references to
numbered pages works fine without that.
That
was what I meaned. Table of contents is pretty useless if there is
neither links to sections, or page numbers. (Of course you can try force
fontsize, margins etc, but that will not work, and takes lots of time.)
Indeed, which is why your "solution" is flawed, the same problems trip
up "author intended" PDF printing.
Other thing is that there is no working way to print tables etc landscape
from webpage.


Pages are printed in portrait or landscape mode, not individual
elements, and it's a user selectable mode, not to be touched by authors.
Headless

--
Email and usenet filter list: http://www.headless.dna.ie/usenet.htm
Jul 20 '05 #6
On Thu, 07 Aug 2003 15:56:43 +0100, Headless <in*************@dna.ie>
wrote:
Stephen Poley <sb*****@xs4all.nl> wrote:
I would only recommend PDF for special
cases when you know that a lot of readers (or certain important readers)
will want to print the document.


What's wrong with printing HTML?


Nothing wrong exactly, but there are several things that one can do in a
word-processor or DTP package that one cannot do in HTML. Page headers
and footers is an example. Control of page breaks is another (available
in CSS, but browser support poor).

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/
Jul 20 '05 #7
In article <7e********************************@4ax.com>, Headless wrote:
Lauri Raittila <la***@raittila.cjb.net> wrote:
As I said, I did that in _browser end_.
Learn to write English (really), the above is gobbledygook.


All the time. I first said I used IE6. Then tried to make it more clear
by saying it is browser. I think you should have understood what I meant.
I meant I was trying to print document using browser. I was _user_. The
fact that I was also author of document was less relevant.
>Also, PDF form is good for long enaugh stuff to need index/toc. There is
>no way to have page numbers in toc using HTML.

CSS2 spec, paged media section.


Sure you can have page numbers. But can you have the same page numbers in
toc? References to certain pages instead of links? No, you can't.


Sure you can, as long as you don't' expect the page numbers to match the
number of pages,


Exactly. What good does it be to say "See page 12 for related information
about foo" when related information is on page 10, 13 or 27 depending on
users font size, margins etc? HTML document that uses links, but those
are not available in print. (they are in some form). With HTML, best you
can do is "See section 5 for related information about foo". If your
sections are 10 page long, it is not much better than nothing.
but that's pointless anyway. A TOC with references to
numbered pages works fine without that.


Exactly how?
That
was what I meaned. Table of contents is pretty useless if there is
neither links to sections, or page numbers. (Of course you can try force
fontsize, margins etc, but that will not work, and takes lots of time.)


Indeed, which is why your "solution" is flawed, the same problems trip
up "author intended" PDF printing.


Exept that you *can* *force* fontsize, margins etc using PDF. That
doesn't restrict people printing HTML.
Other thing is that there is no working way to print tables etc landscape
from webpage.


Pages are printed in portrait or landscape mode, not individual
elements, and it's a user selectable mode, not to be touched by authors.


You mean you don't mind that table will be printed so that one part of
table is on other side of paper when it is too wide to fit portait paper,
instead of it being made landscape, or whole table layout made
differently?
--
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.

Jul 20 '05 #8
In article <ns********************************@4ax.com>, Headless wrote:
Lauri Raittila wrote:
HTML document that uses links, but those
are not available in print. (they are in some form). With HTML, best you
can do is "See section 5 for related information about foo". If your
sections are 10 page long, it is not much better than nothing.
I disagree, it's a much better approach than using page numbers. Refer
to sections and list those in a header and/or footer on every page. This
method is also common in classic printed media because it fits the way
users use multi page documents.


And if there is no suitable numbered subsubsubheadings to refer? If
target is something like <dfn id="HTML"><strong>HTML</strong> is computer
code used for www-pages.</dfn>
If I'm referred to section 6.3.4 in a TOC then I look at the total
number of sections, if for example it's 12 then I jump directly to a
page roughly halfway in the stack and look at the section numbering on
that page, I don't start at page 1 and then count pages 1, 2, 3, 4, 5
etc.
Sure. Again, when sections are multipage, it will become impossible.
Think about indexes.
Indeed, which is why your "solution" is flawed, the same problems trip
up "author intended" PDF printing.


Exept that you *can* *force* fontsize, margins etc using PDF.


Can you force paper size or printing resolution using PDF?


I don't know, but that doesn't matter. AFAIK I can pretty much force how
much text/images fits one page. And it is user choise to print
smaller/bigger pages, he can see what size they are.
>Other thing is that there is no working way to print tables etc landscape
>from webpage.

Pages are printed in portrait or landscape mode, not individual
elements, and it's a user selectable mode, not to be touched by authors.

Can user select that he wants to print tables too wide to fit portait
paper on landcape paper? He could print all tables landscape if CSS for
it would be suppoerted, but it isn't.
You mean you don't mind that table will be printed so that one part of
table is on other side of paper when it is too wide to fit portait paper,
instead of it being made landscape, or whole table layout made
differently?


User problem, not an author problem.


User problem is author problem. Otherwise every author could produce
their own XML/SGML/MagicMarkup and say user should have suitable tool to
read it. Too bad if there isn't any.
If you suspect that some users
won't be able to print your data in portrait mode then you could include
a suggestion to print in landscape mode.


Like this:
"Some of the tables in this HTML document may not fit on portrait paper.
You can print all the pages landscape, but then [text is hard to read |
you luse 40% paper for margins]."

Better:
"Tables and other things on this HTML document may print strangely. We
recommend printing _PDF version_ of this document" (PDF version being
link to PDF version)

--
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.

Jul 20 '05 #9

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

687
by: cody | last post by:
no this is no trollposting and please don't get it wrong but iam very curious why people still use C instead of other languages especially C++. i heard people say C++ is slower than C but i can't...
4
by: John Friedland | last post by:
'printf' has a '%a' conversion for floating-point output: For example, printing '123456' with "|%13.4a|" produces | 0x1.e240p+16| I've looked through Josuttis and the header files, but I...
18
by: n.torrey.pines | last post by:
I understand that with floats, x*y == y*x, for example, might not hold. But what if it's the exact same operation on both sides? I tested this with GCC 3.4.4 (Cygwin), and it prints 0 (compiled...
23
by: ultimatewarrior | last post by:
Hi all, first of all I beg your pardon if this question has been asked before, but I was unable to find anything in the past posts. I have written a piece of code that was supposed to be quite...
4
by: john | last post by:
I am reading TC++PL3, and on page 468, at "21.4.3 Floating-Point Output", it formats floating point output in the style: cout.setf(ios_base::scientific, ios_base::floatfield); // use scientific...
39
by: rembremading | last post by:
Hi all! The following piece of code has (for me) completely unexpected behaviour. (I compile it with gcc-Version 4.0.3) Something goes wrong with the integer to float conversion. Maybe somebody...
15
by: arnuld | last post by:
Next month I will start to work on a C++ based Software named CAT++ which is going to provide FORTRAN like arrays in C++ and will be used within Scientific Community and hence will heavily depend...
6
by: Jeremy | last post by:
I've got a floating div which becomes visible when a link is clicked. I want the div to be hidden when the user clicks anywhere on the page except for whithin the div. What is the best way to do...
4
by: mathieu | last post by:
Hello, Has anyone heard of the 'half' floating point type. That would be a 16bits floating point, see for example: http://oss.sgi.com/projects/ogl-sample/registry/ARB/half_float_pixel.txt ...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
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
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
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...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
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...
0
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...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.