CSS Bottom Margin Issue -


i creating list name, job description, , location. list contains 30 or names. last item-location in list have 20px of margin below separate names. like:

name
job description
location

name
job description
location

name
job description
location

etc.

i'm having issues text color, main issue spacing.

jsfiddle below code:

<style> .hed_brown {       font-family:"trebuchet ms", arial, helvetica, sans-serif;       font-size: 16px;       color: #996633;       line-height: 18px;       margin-left: 15px;   }   .hed_green {       font-family:"trebuchet ms", arial, helvetica, sans-serif;       font-size: 16px;       color: #7f9c99;       line-height: 18px;       margin-left: 15px;   }   .hed_blue {       font-family:"trebuchet ms", arial, helvetica, sans-serif;       font-size: 16px;       color: #011e41;       line-height: 18px;       margin-left: 15px;       margin-bottom: 20px;   }   </style>  <span class="hed_brown">robert mazzeo</span> <br> <span class="hed_green">load out manager</span> <br> <span class="hed_blue">lakeland fl</span>  <br> <span class="hed_brown">wj mahon jr.</span> <br> <span class="hed_green">sales manager</span> <br> <span class="hed_blue">jacksonville fl</span>  <br> <span class="hed_brown">charles metzger</span> <br> <span class="hed_green">display assistant</span> <br> <span class="hed_blue">wichita ks</span> <br> 

here's 1 way:

http://jsfiddle.net/jonigiuro/gekp8/1/

.hed_blue {   font-family:"trebuchet ms", arial, helvetica, sans-serif;   font-size: 16px;   color: #011e41;   line-height: 18px;   margin-left: 15px;   margin-bottom: 20px;   display: block; } 

span elements, "display: inline" default, that's why needed

<br> 

if declare them "display: block" problem solved


Comments

Popular posts from this blog

html - How to style widget with post count different than without post count -

How to remove text and logo OR add Overflow on Android ActionBar using AppCompat on API 8? -

IIS->Tomcat Redirect: multiple worker with default -