473,386 Members | 1,699 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,386 software developers and data experts.

how to break long legend tag caption into multiple lines?

Hi,

We have some html source like this:

<div class="survey">
<form action="students/cbe-graduate-students/survey.html"
method="post" id="frmPbSurvey">

<fieldset class="survey_item">
<legend class="question"><span class="questionNumber">6.</span>If the
answer to question 11 is yes, do you think they provide adequate
services for advanced degree employment opportunities?</legend>

<input type="radio" name="tx_pbsurvey_pi1[7][0][0]" value="1" /
>No<br />
<input type="radio" name="tx_pbsurvey_pi1[7][0][0]" value="2" /
>Yes<br />
</fieldset>

....
<fieldset ...>
</fieldset>

</form>
</div>

Some questions are pretty long and cannot fit in the layout. My
current style sheet has,

..survey div {margin-bottom: 10px;}
..survey_item {margin-top: 10px; margin-bottom: 10px;}
..question {font-size: 100%; font-weight: bold; }

What should I so long questions can be broken into multiple lines to
fit in the layout that has 450px width?

Thanks in advance for any help,

Bing

Feb 23 '07 #1
5 10123
Scripsit du****@gmail.com:
<legend class="question"><span class="questionNumber">6.</span>If the
answer to question 11 is yes, do you think they provide adequate
services for advanced degree employment opportunities?</legend>
From the styling point of view, <legendis a nightmare. The common
rendering of <legendin browsers cannot be described in CSS terms, and CSS
settings have varying effects on it.

One of the problems is that normal wrapping does not take place, and setting
white-space: normal doesn't change this. You can insert explicit line breaks
in the markup, using <br>, but that would be awkward.

From the markup point of view, the problem of excessively long <legend>
texts should not appear. According to the HTML 4.01 specification, "The
LEGEND element allows authors to assign a caption to a FIELDSET. The legend
improves accessibility when the FIELDSET is rendered non-visually." It has,
among other things, the following example:

<FIELDSET>
<LEGEND>Current Medication</LEGEND>
Are you currently taking any medication?
<INPUT name="medication_now"
...
</FIELDSET>

So the general idea is that the legend is a short caption, or like a
low-level heading. Without context, it is of course impossible to make a
specific suggestion on the formulation. But generally, a legend that needs
to wrap (in fairly normal browsing situations) is too long and needs
reformulation.
Some questions are pretty long and cannot fit in the layout.
Just put the questions inside the <fieldsetafter the <legendelement.
.question {font-size: 100%; font-weight: bold; }
Bolding long texts is generally counter-productive, since bold text is more
difficult to read. The legend might be bolded, but the question should be
normal text so that it can be read conveniently.
What should I so long questions can be broken into multiple lines to
fit in the layout that has 450px width?
For all that you can know, 450px might not accommodate a _word_ without
wrapping. Stop imposing fixed widths, _especially_ on forms. A page with a
form is not supposed to be primarily an esthetic experience but a user
interface. Let form follow function. The user may need all the space
available.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Feb 23 '07 #2
On Feb 23, 2:07 am, "Jukka K. Korpela" <jkorp...@cs.tut.fiwrote:
Scripsit dub...@gmail.com:
<legend class="question"><span class="questionNumber">6.</span>If the
answer to question 11 is yes, do you think they provide adequate
services for advanced degree employment opportunities?</legend>

From the styling point of view, <legendis a nightmare. The common
rendering of <legendin browsers cannot be described in CSS terms, and CSS
settings have varying effects on it.

One of the problems is that normal wrapping does not take place, and setting
white-space: normal doesn't change this. You can insert explicit line breaks
in the markup, using <br>, but that would be awkward.

From the markup point of view, the problem of excessively long <legend>
texts should not appear. According to the HTML 4.01 specification, "The
LEGEND element allows authors to assign a caption to a FIELDSET. The legend
improves accessibility when the FIELDSET is rendered non-visually." It has,
among other things, the following example:

<FIELDSET>
<LEGEND>Current Medication</LEGEND>
Are you currently taking any medication?
<INPUT name="medication_now"
...
</FIELDSET>

So the general idea is that the legend is a short caption, or like a
low-level heading. Without context, it is of course impossible to make a
specific suggestion on the formulation. But generally, a legend that needs
to wrap (in fairly normal browsing situations) is too long and needs
reformulation.
Some questions are pretty long and cannot fit in the layout.

Just put the questions inside the <fieldsetafter the <legendelement.
.question {font-size: 100%; font-weight: bold; }

Bolding long texts is generally counter-productive, since bold text is more
difficult to read. The legend might be bolded, but the question should be
normal text so that it can be read conveniently.
What should I so long questions can be broken into multiple lines to
fit in the layout that has 450px width?

For all that you can know, 450px might not accommodate a _word_ without
wrapping. Stop imposing fixed widths, _especially_ on forms. A page with a
form is not supposed to be primarily an esthetic experience but a user
interface. Let form follow function. The user may need all the space
available.

--
Jukka K. Korpela ("Yucca")http://www.cs.tut.fi/~jkorpela/
Thanks much for the lucid explanation! Really appreciated it. Looks
like <fieldsetand <legenddoesn't fit in out situation. I changed
to <div>, all looks better now.

Bing

Feb 23 '07 #3
du****@gmail.com wrote:
On Feb 23, 2:07 am, "Jukka K. Korpela" <jkorp...@cs.tut.fiwrote:
>>Scripsit dub...@gmail.com:
>>From the markup point of view, the problem of excessively long <legend>
texts should not appear. According to the HTML 4.01 specification, "The
LEGEND element allows authors to assign a caption to a FIELDSET. The legend
improves accessibility when the FIELDSET is rendered non-visually." It has,
among other things, the following example:

<FIELDSET>
<LEGEND>Current Medication</LEGEND>
Are you currently taking any medication?
<INPUT name="medication_now"
...
</FIELDSET>

So the general idea is that the legend is a short caption, or like a
low-level heading. Without context, it is of course impossible to make a
specific suggestion on the formulation. But generally, a legend that needs
to wrap (in fairly normal browsing situations) is too long and needs
reformulation.
>>>Some questions are pretty long and cannot fit in the layout.

Just put the questions inside the <fieldsetafter the <legendelement.

Thanks much for the lucid explanation! Really appreciated it. Looks
like <fieldsetand <legenddoesn't fit in out situation. I changed
to <div>, all looks better now.
Then it seems as if you didn't read all of Jukka's words. What's wrong with:

<fieldset class="survey_item">
<legend class="question"><span class="questionNumber">6.</span></legend>
If the answer to question 11 is yes, do you think they provide adequate
services for advanced degree employment opportunities?
<input type="radio" name="tx_pbsurvey_pi1[7][0][0]" value="1" />No<br />
?

--
John
Feb 23 '07 #4
On Feb 23, 9:04 am, John Hosking <J...@DELETE.Hosking.name.INVALID>
wrote:
dub...@gmail.com wrote:
On Feb 23, 2:07 am, "Jukka K. Korpela" <jkorp...@cs.tut.fiwrote:
>Scripsit dub...@gmail.com:
From the markup point of view, the problem of excessively long <legend>
texts should not appear. According to the HTML 4.01 specification, "The
LEGEND element allows authors to assign a caption to a FIELDSET. The legend
improves accessibility when the FIELDSET is rendered non-visually." It has,
among other things, the following example:
<FIELDSET>
<LEGEND>Current Medication</LEGEND>
Are you currently taking any medication?
<INPUT name="medication_now"
...
</FIELDSET>
>So the general idea is that the legend is a short caption, or like a
low-level heading. Without context, it is of course impossible to make a
specific suggestion on the formulation. But generally, a legend that needs
to wrap (in fairly normal browsing situations) is too long and needs
reformulation.
>>Some questions are pretty long and cannot fit in the layout.
>Just put the questions inside the <fieldsetafter the <legendelement.
Thanks much for the lucid explanation! Really appreciated it. Looks
like <fieldsetand <legenddoesn't fit in out situation. I changed
to <div>, all looks better now.

Then it seems as if you didn't read all of Jukka's words. What's wrong with:

<fieldset class="survey_item">
<legend class="question"><span class="questionNumber">6.</span></legend>
If the answer to question 11 is yes, do you think they provide adequate
services for advanced degree employment opportunities?
<input type="radio" name="tx_pbsurvey_pi1[7][0][0]" value="1" />No<br />
?

--
John
Aha! Thanks much for waking me up. I got the point now. Yup, looks
like that helps fix my problem.

Bing

Feb 23 '07 #5
بسم الله الرحمن الرحيم
افضل موقع للتعارف بين الجنس ين الشباب والبنات من كل دول العالم
www.arabzwaj.com

بنات وشباب عايزيين يتعرفوا عليكم
صور عارية حقيقية
تعارف مجاني من كل دول العالم www.arabzwaj.com
for marrige and friend shipافضل تعارف بين الشباب والبنات موقع زواج
مجاني www.arabzwaj.com

www.arabzwaj.com افضل موقع مجاني للتعارف و للزواج الشرعي

www.arabzwaj.com بنات وشباب عايزه تتعرف عليكم

the best web site formarrige and frindship www.arabzwaj.comافضل موقع
مجاني للتعارف و للزواج
Feb 24 '07 #6

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

Similar topics

1
by: Jorl Shefner | last post by:
I've only been able to plot data with both symbols and lines by issuing two plot commands, one for markers and one for lines. That's perfectly fine, but it creates a problem when I try to create a...
1
by: Jorl Shefner | last post by:
I have a problem that I run into a lot with the 'legend' command's default behavior. I've found a work-around but I wonder if there's a better way. For a simple example, take the following:...
14
by: Ian Rastall | last post by:
I'm curious as to the group's feelings about using the <fieldset> and <legend> tags around elements other than <form> elements ... I wrote a small test file:...
0
by: Tracy Griever via AccessMonster.com | last post by:
Simple way to change/remove the "Sum of..." text, or any text, in a PivotChart LEGEND. I searched other sites for many hours and could find no help on this subject...a co-worker stumbled upon the...
6
by: Danny Lesandrini | last post by:
I'm using an Access database to drive a web site and the colors of various table backgrounds are stored in Access. I want users of the Access database to be able to select colors for the site, but...
4
by: Adam Smith | last post by:
Hello, Can I use <fieldset><legend><tr><tr> </tr></tr></fieldset></legend> to select multiple rows in a Table such that I can demarcate several rows containing form elements in a table? ...
2
by: bwaha | last post by:
Has anyone figured out how to get a legend for each line in a matplotlib.collections.LineCollection instance? No problem if I plot lines the default way ie. line,=plot(x,y). But I've had to...
0
by: Martijn Mulder | last post by:
I use resgen.exe to 'compile' my resource.txt - file to resource.resources. Some of the values in the name=value declarations are so long that I want to write them on two lines, like this: ...
17
by: kevgibbo | last post by:
Hi, I'm currently having a problem where a long URL or a line of text with no spaces will break the design of a webpage, http:// blog.seoptimise.com/2007/01/how-to-add-delicious-and-digg-blog-...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
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: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
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: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
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:
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...
0
marktang
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 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.