CODEWITHSUNDEEP
htmlcss
Becky
Becky

Reputation: 5595

Having different font sizes in a sentence

How do I have a bigger font size for only a single character in a sentence?

For a example: All characters except - in "Click - sign" should be font size 13. And only - should be font size 55. The sentence should look normal. See Fiddle. The - sign is higher than the rest of the text.

<div class="aa"> 
    Click <span Style="font-size:30px; line-height:45px;">-</span> sign
</div>

aa {
  font-size: 13px;
}

EDIT:

enter image description here

Upvotes: 3

Views: 1382

Answers (2)

Karthik N
Karthik N

Reputation: 535

use this css

* { 
    margin: 0; 
    padding: 0;
}
p {
    font-size: 13px;
}
p span.hlt_txt{
    font-size: 55px; 
    line-height: 0;     
    vertical-align: top;
}

HTML

<p class="aa"> 
    Click <span class="hlt_txt">-</span> sign
</p>

Upvotes: 0

pavel
pavel

Reputation: 27092

Here you can use position: relative; for hyphen:

span {font-size:30px; position: relative; top: 3px;}

https://jsfiddle.net/fLvtjwcw/1/

Upvotes: 2

Related Questions