473,881 Members | 1,691 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Pre

A few questions about pre...

When presenting preformatted text using the white-space: pre;
property/value, Opera renders long lines at small viewport widths as
exiting the borders of the element, IE6 extends the element to contain the
line. Both necessitate horizontal scrolling.

1) Is one considered incorrect, or are both fair interpretations of the
recommendation?

2) It would seem the IE performance has the advantage of retaining
intended contrast between text color and background color. Are there
differing opinions you can share?

3) Obviously, unless one is presenting ASCII art or other width-dependent
content, the line length must be considered to prevent unnecessary
horizontal scrolling. Lines of programming code, for example, can be
legally broken at certain places, and should be to prevent such overflow.
If no collapsing of whitespace is desired the pre value must be in force,
but this prevents the UA from creating new line breaks as well. What would
be the most user-respecting solution to this line-length dilemma, within
the constraints of valid HTML and "valid" CSS?
Jul 20 '05 #1
3 3802
Neal <ne*****@spamrc n.com> wrote:
When presenting preformatted text using the white-space: pre;
property/value, Opera renders long lines at small viewport widths
as exiting the borders of the element, IE6 extends the element to
contain the line. Both necessitate horizontal scrolling.
Have you set the width and border? How? URL?
1) Is one considered incorrect, or are both fair interpretations of
the recommendation?
If an explicit width has been set, it shall be honored. Content may
overflow, and normally will by default.
2) It would seem the IE performance has the advantage of retaining
intended contrast between text color and background color.
Such issues should not arise. Why would you set the width narrower than
needed.
3) Obviously, unless one is presenting ASCII art or other
width-dependent content, the line length must be considered to
prevent unnecessary horizontal scrolling.
Sorry, I understand all the words but not the idea in the statement.
Lines of programming
code, for example, can be legally broken at certain places, and
should be to prevent such overflow.
No, if you say white-space: pre, you are saying that lines should never
be broken except as you have broken them in the HTML source.
If no collapsing of whitespace
is desired the pre value must be in force,
Sounds like you're looking for white-space: pre-wrap, but it's in the
CSS 2.1 draft (not in CSS 2.0) and it's poorly supported.
What would be the most
user-respecting solution to this line-length dilemma, within the
constraints of valid HTML and "valid" CSS?


You could use no-break spaces in HTML to prevent whitespace collapse
(this is not _guaranteed_ to work, but it mostly does), and not use CSS
at all. Lines would get broken normally then. However, "normal" is
often absurd in current browsers, since they take liberties in breaking
strings (e.g., breaking "-b" into "-" and "b"), see
http://www.cs.tut.fi/~jkorpela/html/nobr.html

But perhaps most importantly, how should lines be broken if they are
indented? If you have an indented line that gets broken, you probably
want the continuation line have at least the same indentation - but
this won't happen normally. In that case you might consider writing a
program that generates markup where each line is inside a <div>
element, either with class attributes or <div> nesting reflecting the
structure so that you can use CSS to set a suitable margin-left. What I
mean is that if you have, say,

if(foo()) {
for(;;) {
bar(); }}

then this would become e.g.

<div class="code">
if(foo()) {
<div> for(;;) {
<div> bar(); }}</div></div>
</div>

(where the leading whitespace in <div> elements is insignificant, by
HTML rules)
and then you could have

div.code div { margin-left: 1em; }

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Jul 20 '05 #2
On Mon, 9 Feb 2004 00:50:47 +0000 (UTC), Jukka K. Korpela
<jk******@cs.tu t.fi> wrote:
Neal <ne*****@spamrc n.com> wrote:
When presenting preformatted text using the white-space: pre;
property/value, Opera renders long lines at small viewport widths
as exiting the borders of the element, IE6 extends the element to
contain the line. Both necessitate horizontal scrolling.
Have you set the width and border? How? URL?


You can observe the behavior and get an idea of what confused you in the
third paragraph at http://users.rcn.com/neal413/test2.html

1) Is one considered incorrect, or are both fair interpretations of
the recommendation?


If an explicit width has been set, it shall be honored. Content may
overflow, and normally will by default.


But notice the difference in behavior between Opera 7.23 and IE6. IE
stretches the element's boundaries to fit. O allows the text to spill
beyond.
2) It would seem the IE performance has the advantage of retaining
intended contrast between text color and background color.


Such issues should not arise. Why would you set the width narrower than
needed.


I'm not sure what you're saying here. I've set no width for pre or its
container.
3) Obviously, unless one is presenting ASCII art or other
width-dependent content, the line length must be considered to
prevent unnecessary horizontal scrolling.


Sorry, I understand all the words but not the idea in the statement.


The example cited above should make this clear.
Lines of programming
code, for example, can be legally broken at certain places, and
should be to prevent such overflow.


No, if you say white-space: pre, you are saying that lines should never
be broken except as you have broken them in the HTML source.


Exactly. One can enter line breaks intentionally to prevent the horizontal
scrolling. But with a fluid design, at what point do we say enough is
enough?
If no collapsing of whitespace
is desired the pre value must be in force,


Sounds like you're looking for white-space: pre-wrap, but it's in the
CSS 2.1 draft (not in CSS 2.0) and it's poorly supported.


Aha. Perhaps.
...In that case you might consider writing a
program that generates markup where each line is inside a <div>
element...


My head aches just thinking about that...
Jul 20 '05 #3
Neal <ne*****@spamrc n.com> wrote:
You can observe the behavior and get an idea of what confused you
in the third paragraph at http://users.rcn.com/neal413/test2.html


Oh, I see. It happens in the simplest case too: create a pre element
with long lines and with a visible border set, and Opera will make the
borders correspond to a block that is 100% of the available width
(which is by default somewhat narrower than the window width, due to
body margin and/or padding) whereas the content overflows.

The same happens with a p element (though it takes more work to force
long lines there, but &nbsp; will do the job fine).
1) Is one considered incorrect, or are both fair interpretations
of the recommendation?


If an explicit width has been set, it shall be honored. Content
may overflow, and normally will by default.


But notice the difference in behavior between Opera 7.23 and IE6.
IE stretches the element's boundaries to fit. O allows the text to
spill beyond.


The width defaults to auto, and as far as I can see, the Opera behavior
is then the correct one. The usual quick way to check that Opera is
right and IE is wrong (as usual) is to view the page on Mozilla. Of
course this is not a quite 100% sure way.
2) It would seem the IE performance has the advantage of
retaining intended contrast between text color and background
color.


Such issues should not arise. Why would you set the width narrower
than needed.


I'm not sure what you're saying here. I've set no width for pre or
its container.


Fair point, I had guessed that you had set a width, and I didn't
realize the impact of the default width.

It seems that adding
pre { display: table-cell; }
fixes this, since it makes the width "as wide as needed". IE does not
understand it, so you get the original incorrect behavior, which is
close to what was wanted here. :-)
3) Obviously, unless one is presenting ASCII art or other
width-dependent content, the line length must be considered to
prevent unnecessary horizontal scrolling.


Sorry, I understand all the words but not the idea in the
statement.


The example cited above should make this clear.


Not quite. Your example has some XML markup (specifically, fragment of
XHTML 1.0 markup) there. Since in XML, whitespace is generally not
honored the way it is inside <pre> elements, you don't need <pre> here
(the same way you would, more or less, need <pre> for presenting
FORTRAN or Python code). You might still use <pre> as a practical
solution. Besides, we have the nasty problem that doctype sniffers are
known to violate specifications by regarding white space as significant
between the quoted strings in a doctype declaration, if memory serves
me right.

Anyway, for XML, HTML, etc. markup I would normally use
<div><code class="...">... </code></div>
unless I wish to preformat it for explanatory purposes. But then one
needs to be cautious with strings that must not be broken, which in
practice implies need for nonstandard <nobr> markup. So in the end,
<pre> might be the least of evils.
...In that case you might consider writing a
program that generates markup where each line is inside a <div>
element...


My head aches just thinking about that...


Oh, that shouldn't be two difficult. The real question is whether you
should write it as a Perl one-liner or a Perl two-liner. :-) Seriously,
writing such markup by hand would be very awkward, but when generated
programmaticall y, you would basically need to just look at leading
whitespace on each line.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Jul 20 '05 #4

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

Similar topics

3
11265
by: William C. White | last post by:
Does anyone know of a way to use PHP /w Authorize.net AIM without using cURL? Our website is hosted on a shared drive and the webhost company doesn't installed additional software (such as cURL) on the server because of that. Our site will have an SSL certificate next week, so I would like to use AIM instead of SIM, however, I don't know how to send data via POST over https and recieve data from the Authorize.net server over an https...
2
5864
by: Albert Ahtenberg | last post by:
Hello, I don't know if it is only me but I was sure that header("Location:url") redirects the browser instantly to URL, or at least stops the execution of the code. But appearantely it continues to execute the code until the browser send his reply to the header instruction. So an exit(); after each redirection won't hurt at all
3
23053
by: James | last post by:
Hi, I have a form with 2 fields. 'A' 'B' The user completes one of the fields and the form is submitted. On the results page I want to run a query, but this will change subject to which field is completed.
0
8507
by: Ollivier Robert | last post by:
Hello, I'm trying to link PHP with Oracle 9.2.0/OCI8 with gcc 3.2.3 on a Solaris9 system. The link succeeds but everytime I try to run php, I get a SEGV from inside the libcnltsh.so library. 354 roberto@ausone:Build/php-4.3.2> ldd /opt/php4/bin/php libsablot.so.0 => /usr/local/lib/libsablot.so.0 libstdc++.so.5 => /usr/local/lib/libstdc++.so.5 libm.so.1 => /usr/lib/libm.so.1
1
8621
by: Richard Galli | last post by:
I want viewers to compare state laws on a single subject. Imagine a three-column table with a drop-down box on the top. A viewer selects a state from the list, and that state's text fills the column below. The viewer can select states from the drop down lists above the other two columns as well. If the viewer selects only one, only one column fills. If the viewer selects two states, two columns fill. Etc. I could, if appropriate, have...
4
18316
by: Albert Ahtenberg | last post by:
Hello, I have two questions. 1. When the user presses the back button and returns to a form he filled the form is reseted. How do I leave there the values he inserted? 2. When the user comes back to a page where he had a submitted POST data the browser keeps telling that the data has expired and asks if repost. How to avoid that? I tried registering all POST and GET vars as SESSION vars but
1
6889
by: inderjit S Gabrie | last post by:
Hi all Here is the scenerio ...is it possibly to do this... i am getting valid course dates output on to a web which i have designed ....all is okay so far , look at the following web url http://www.mis.gla.ac.uk/biquery/training/ but each of the courses held have maximum of 8 people that could be
2
31459
by: Jack | last post by:
Hi All, What is the PHP equivilent of Oracle bind variables in a SQL statement, e.g. select x from y where z=:parameter Which in asp/jsp would be followed by some statements to bind a value to :parameter I dont like the idea of making the SQL statement on the fly without binding parameters as I dont want a highly polluted SQL cache.
3
23616
by: Sandwick | last post by:
I am trying to change the size of a drawing so they are all 3x3. the script below is what i was trying to use to cut it in half ... I get errors. I can display the normal picture but not the results of the picture half the size. The PHP I have installed support 1.62 or higher. And all I would like to do is take and image and make it fit a 3x3. Any suggestions to where I should read or look would be appreciated.
0
9776
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 effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
11100
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, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
1
10816
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 Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
10401
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 protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
1
7953
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
7110
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 then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5977
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
2
4196
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
3225
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

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.