Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

bulleted list does not align the text on the 2nd line 2

Status
Not open for further replies.

paulajune

Technical User
Feb 20, 2004
72
US
Greetings,

My bulleted list does not align the text on the 2nd line. It goes right to the left margin and I can't indent it. It DOES align if I do the basic
<ul>
<li>long line of text that wraps to two or more lines</li>
<li>long line of text that wraps to two or more lines</li>
<li>long line of text that wraps to two or more lines</li>
</ul>
but then I get the extra blank line I don't want between the bulleted list and the preceding unbulleted line of text. I eliminated the extra line with some of the code I copied from someone else, shown below, but then you'll see if you paste it into a test page, that the lines following the first line don't align with the text. Can I have it both ways? :
- line of text
- no line space after line of text
- 1st bullet, 2nd bullet and so on, wrapping, but aligning to margin where 1st line of bulleted text starts.

I hope this makes sense. Below is an example. (note - I have to keep the <br>s in there because I'm trying to force the column width since I seem to be unable to do it the normal way - but I get the same bad bullet wrapping results with or without the <br>s).

Thanks so much,
PaulaJune

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
ul {
padding: 0px;
margin:0;
list-style: disc inside;
}
p {margin:0;padding:0}
</style>
</head>

<body>
<p>
<table width="505" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="335"><p><strong>Mission:</strong><br />
Everything I do is inspired by my enduring mission:
<ul>
<li>To enhance and improve client documents . . . <br>
&ldquo;Paulish it!&rdquo; With expert proofing, editing and<br>
formatting.</li>
<li>To create new documents of beauty . . . with an<br>
artist&rsquo;s flair, a technician&rsquo;s accuracy and an author&rsquo;s<br>
style.</li>
<li>To deliver projects with integrity . . . with<br>
timeliness, fair pricing and accountability.</li>
</ul></td>
<td width="170">&nbsp;</td>
</tr>
</table>
</body>
</html>
 
Hi

PaulaJune said:
I get the extra blank line I don't want between the bulleted list and the preceding unbulleted line of text.
For that would be enough to reduce the [tt]margin[/tt] to 0. Even more, just [tt]ul[/tt]'s [tt]margin-top[/tt] and [tt]p[/tt]'s [tt]margin-bottom[/tt] is enough.
PaulaJune said:
I have to keep the <br>s in there because I'm trying to force the column width
That you could do by setting the [tt]width[/tt]. Either [tt]ul[/tt]'s, or some parent node's.

I suggest to use markup semantically :
[ul]
[li]that Mission look like kind of title or subtitle, so better mark it with the suitable heading tag, [tt]h1[/tt]..[tt]h6[/tt][/li]
[li]use [tt]table[/tt] to display tabular data, not to adjust the look[/li]
[/ul]
The below is semantically and syntactically correct rewrite :
Code:
[red]<!DOCTYPE[/red] [maroon]html[/maroon] [maroon]PUBLIC[/maroon] [green][i]"-//W3C//DTD XHTML 1.0 Transitional//EN"[/i][/green] [green][i]"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"[/URL][/i][/green][red]>[/red]
[b]<html[/b] [maroon]xmlns[/maroon][teal]=[/teal][green][i]"[URL unfurl="true"]http://www.w3.org/1999/xhtml"[/URL][/i][/green][b]>[/b]
[b]<head>[/b]
[b]<meta[/b] [maroon]http-equiv[/maroon][teal]=[/teal][green][i]"Content-Type"[/i][/green] [maroon]content[/maroon][teal]=[/teal][green][i]"text/html; charset=utf-8"[/i][/green] [b]/>[/b]
[b]<title>[/b]Untitled Document[b]</title>[/b]
[b]<style[/b] [maroon]type[/maroon][teal]=[/teal][green][i]"text/css"[/i][/green][b]>[/b]
ul [teal]{[/teal]
  [COLOR=coral]width:[/color] [COLOR=darkgoldenrod]25em[/color];
[teal]}[/teal]
h1 [teal]{[/teal]
  [COLOR=coral]font-size:[/color] [COLOR=darkgoldenrod]medium[/color];
[teal]}[/teal]
h1[teal],[/teal]ul[teal],[/teal]p [teal]{[/teal]
  [COLOR=coral]margin:[/color] [COLOR=darkgoldenrod]0[/color];
[teal]}[/teal]
[b]</style>[/b]
[b]</head>[/b]
[b]<body>[/b]
[b]<h1>[/b]Mission:[b]</h1>[/b]
[b]<p>[/b]Everything I do is inspired by my enduring mission:[b]</p>[/b]
[b]<ul>[/b]
[b]<li>[/b]To enhance and improve client documents... [red]&ldquo;[/red]Paulish it![red]&rdquo;[/red] With expert proofing, editing and formatting.[b]</li>[/b]
[b]<li>[/b]To create new documents of beauty... with an artist[red]&rsquo;[/red]s flair, a technician[red]&rsquo;[/red]s accuracy and an author[red]&rsquo;[/red]s style.[b]</li>[/b]
[b]<li>[/b]To deliver projects with integrity... with timeliness, fair pricing and accountability.[b]</li>[/b]
[b]</ul>[/b]
[b]</body>[/b]
[b]</html>[/b]
But I could be wrong, as I barely understood your requirement. If I misunderstood something, please draw a sketch.


Feherke.
 
Thank you! This is definitely better than what I have, and if you can't figure out the rest of the request, I'll still use what you devised. Request: can we line up bullets at the left margin just under the preceding line of unbulleted text?

Please go to - I pasted a .jpg of a screen print in Word.

Thanks again,
PJ
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top