CODEWITHSUNDEEP
htmlcssangular2-template
Hlayiseka Russel
Hlayiseka Russel

Reputation: 25

How do I add two CSS rules to one html element

 <p class="smallText">{{vehicleItem.registration}}, {{vehicleItem.colour}} {{vehicleItem.make}} {{vehicleItem.model}}</p>

I'd like to capitalize vehicle registration and model and make should be camel case

Upvotes: 0

Views: 129

Answers (3)

dVeza
dVeza

Reputation: 552

I'm not experienced with angular but you should be able to use different functions like 

capitalizeFirstLetter(vehicleItem.registration)

and camelize(vehicleItem.model)

Converting any string into camel case

How do I make the first letter of a string uppercase in JavaScript?

Upvotes: 0

Johannes
Johannes

Reputation: 67778

You can write as many classes into an HTML tag as you want, thereby applying as many CSS rules as you want. Example:

<p class="smallText myclass_1 myclass_2">

Upvotes: 0

Comfort Ajala
Comfort Ajala

Reputation: 36

I will suggest wrapping registration and make with a span containing different classes e.g. 

<p><span class="capitalize">{{vehicleItem.registration}}, {{vehicleItem.colour}} <span class="camel-case">{{vehicleItem.make}} </span> {{vehicleItem.model}}</p>

This way you are adding "two" css rules to one element. I also recommend you achieve the camelcase style using Javascript.

Upvotes: 1

Related Questions