How do I apply a css style to a template in meteor -

How do I apply a css style to a template in meteor -

<template name="userpill"> <span>{{zipcode}}</span> <span>{{city}}</span> </template>

the above template beingness used meteor autocomplete. need vertical scrollbar on container around list, user can scroll through these values. appreciate help.

thanks

the template tag not exist in dom, can't rely on css. if need target template (as opposed adding generic classes elements), best bet wrap contents in div so:

class="lang-html prettyprint-override"><template name="userpill"> <div class="user-pill"> <span>{{zipcode}}</span> <span>{{city}}</span> </div> </template>

then can target in css:

class="lang-css prettyprint-override">.user-pill { color: red; }

in larger projects, prefer utilize double underscore identify class names templates, e.g. <div class="__user-pill">. may little ugly find it's helpful figure out what's going on.

based on comment, looks need style container of userpill. let's have template this:

class="lang-html prettyprint-override"><template name="userpillcontainer"> <div class="user-pill-container"> {{> userpill name="home"}} {{> userpill name="about"}} {{> userpill name="profile"}} </div> </template>

then can target container in same way above:

class="lang-css prettyprint-override">.user-pill-container { border: 1px solid black; }

meteor meteor-blaze