Solved

Is there a simple way to justify a list-item (both the list-item-label and list-item-body) with XSL?

Posted on 2006-06-29
7
274 Views
Last Modified: 2006-11-18
In a web application, a user is allowed to use a Word-like text editor to write portions of a document.  The HTML output of this editor is rendered into a PDF using XSL.  There is a requirement to allow arbitrary horizontal alignment (left/start, center, and right/end) at the line item level (that is, not simply at the list level) for bulleted or numbered lists.  Here are a few examples of possible "valid" (but naturally in poor design taste) lists.  Note that each set of three items represents a completely different list.

1. item
2. item
3. item
                              * item
                              * item
                              * item
                                                            1. item
                                                            2. item
                                                            3. item
1. item
                              2. item
                                                            3. item
                                                            * item
                              * item
* item
etc.

However, when we attempt to format the HTML, the best we can get is something like:
1. item
2.                              item
3.                                                            item
0
Comment
Question by:dfu23
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
7 Comments
 
LVL 60

Expert Comment

by:Geert Bormans
ID: 17016070
Hi dfu23,

can you not just left allign the items in lists using CSS?

Cheers!
0
 
LVL 22

Expert Comment

by:_TAD_
ID: 17018649


When you generate your HTML, use an in-line style sheet

<HTML>
<HEAD>
<STYLE TYPE="text/css">
  LI { font-size: large; color: black }
  LI.LEFT { font-size: large; text-align: left;  color: black; }
  LI.RIGHT { font-size: large; text-align: right;  color: black; }
  LI.CENTER { font-size: large; text-align: center;  color: black; }
</STYLE>
<HEAD>

<BODY>

<OL>
  <LI class="LEFT">some Text</LI>
  <LI class="RIGHT">more text</LI>
</OL>

</BODY>
</HTML>


This will produce:
 
   1. some text
   2.              more text


0
 
LVL 22

Expert Comment

by:_TAD_
ID: 17018683


You may also be interested in the list-style-position, margin-left, text-indent or padding-left

Here's  site to help you decide which style is best for you.
http://www.zvon.org/xxl/css1Reference/Output/index.html
0
 
LVL 14

Author Comment

by:dfu23
ID: 17077139
TAD,

If you look at my original question again, we are able to get the lists formatted as you describe.  However, we want the bullet/number to match the alignment of the text itself.  That is, either both are to the left, centered, or to the right.  Having the text to the left, centered, or to the right while the bullet/number is always to the left is not what we're looking for.

Any other ideas?
0
 
LVL 22

Accepted Solution

by:
_TAD_ earned 250 total points
ID: 17080879
Here.... This does what you need.  






<HTML>
<HEAD>
<STYLE TYPE="text/css">
  LI { font-size: large; color: black }
  LI.LEFT { font-size: large; text-align: left;  color: black; }
  LI.RIGHT { font-size: large; text-align: right;  color: black; }
  LI.CENTER { font-size: large; text-align: center;  color: black; }
</STYLE>
<HEAD>

<BODY>

<Table>
   <TR>
     <TD Width=500>   <!-- This number changes the relative spacing -->
        <OL>
           <LI class="LEFT">some Text</LI>
           <LI class="center">other Text</LI>
           <LI class="RIGHT">more text</LI>
        </OL>
     </TD>
   </TR>
</Table>
</BODY>
</HTML>
0

Featured Post

Learn by Doing. Anytime. Anywhere.

Do you like to learn by doing?
Our labs and exercises give you the chance to do just that: Learn by performing actions on real environments.

Hands-on, scenario-based labs give you experience on real environments provided by us so you don't have to worry about breaking anything.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The Client Need Led Us to RSS I recently had an investment company ask me how they might notify their constituents about their newsworthy publications.  Probably you would think "Facebook" or "Twitter" but this is an interesting client.  Their cons…
Introduction In my previous article (http://www.experts-exchange.com/Microsoft/Development/MS-SQL-Server/SSIS/A_9150-Loading-XML-Using-SSIS.html) I showed you how the XML Source component can be used to load XML files into a SQL Server database, us…
In this video we outline the Physical Segments view of NetCrunch network monitor. By following this brief how-to video, you will be able to learn how NetCrunch visualizes your network, how granular is the information collected, as well as where to f…
Michael from AdRem Software explains how to view the most utilized and worst performing nodes in your network, by accessing the Top Charts view in NetCrunch network monitor (https://www.adremsoft.com/). Top Charts is a view in which you can set seve…

717 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question