margins with <span>

[emaston]

I'm having some issues maintaining the margins I set in CSS. I'm trying to make something resembling an outline within a paragraph by using <span> to style the text under each heading. I want the text under the heading to shift about 30px to the left but remain within the width of the <p>. When I use the padding or margin properties, only the first line with the <span> shifts to the right. I can use position:realtive to shift the entire <span>, but then it extends beyond the width of the <p>.The sample code is like so:

<p class="example">HISTORY<br /><span class="example">Western Society for Pediatric Research (Member of Council 1971-74)<br />Association of Medical School Pediatric Chairmen, Inc., California Chapter Organizer and Administrative Officer, 1983-88<br />Special Recognition Award for Services to the Department of Pediatrics, the University of California, Irvine, and the Children of Orange County Outstanding Faculty Teaching Award, Department of Pediatrics, University of California, Irvine, 1996 and 2000.</span></p>

This is the corresponding css code

p.example{width: 200px; height: 200px; position: absolute; top: 100px; left: 100px; font-family:verdana, 'sans-serif'; font-size: 10px; color: rgb(0,0,0); overflow: scroll;}span.example{color: rgb(100,100,100); margin-left: 30px;}

I have tried replacing margin-left: with padding-left: and encounter the same problem. Why doesn't the margin apply to all of the text within the <span>? Does is have something to do with the insertion of <br />? HELP!Em

[F-Man]

Looks to me that you should be using an unordered list instead. <ul>Then you could give a left margin or padding to every <li> inside that list. If you want to remove the bullets, you can use CSS list-style-type: none;

<h2>History</h2><ul id="example">   <li>Western Society for Pediatric Research (Member of Council 1971-74)</li>   <li>Association of Medical School Pediatric Chairmen, Inc., California Chapter Organizer and Administrative Officer, 1983-88</li>   <li>Special Recognition Award for Services to the Department of Pediatrics, the University of California, Irvine, and the Children of Orange County Outstanding Faculty Teaching Award, Department of Pediatrics, University of California, Irvine, 1996 and 2000.</li></ul>

h2 {   color: black;   text-transform: uppercase;}#example {   width: 200px;   height: 200px;   list-style-type: none;   margin: 100px 0 0 100px;   padding: 0;   font: 10px verdana, 'sans-serif';   overflow: scroll;}#example li {   color: rgb(100,100,100);   margin-left: 30px;}