first-letter capital (css) on blog page

4 Posts

mazzarino posted this 25 December 2018

What I would like to obtain is the result#1 (result1.jpg) and not what I obtain with this CSS as result#2 (result2.jpg)

p:first-letter{
color: #666;
font-size: 3em;
float: left;
}

Can anybody help me in obtaining the best result? I just want to have the uppercase for the first letter of the post in the blog page and not to all the words in the pages including the header ...
Thank you and Merry Xmas
Thank you so muc

What I would like to obtain is the result#1 (result1.jpg) and not what I obtain with this CSS as result#2 (result2.jpg) p:first-letter{ color: #666; font-size: 3em; float: left; } Can anybody help me in obtaining the best result? I just want to have the uppercase for the first letter of the post in the blog page and not to all the words in the pages including the header ... Thank you and Merry Xmas Thank you so muc

Last edited 25 December 2018 by mazzarino

blog-page uppercase

Result1.JPG

Result2.JPG

Vote to pay developers attention to this features or issue.

2 Replies

Order By: Standard | Newest

Support Team posted this 25 December 2018

Hi Christian,

I just want to have the uppercase for the first letter of the post in the blog page and not to all the page including the header ...

You use p:first-letter selector, which selects and styles the first letter of every p element on the page. If you want to style only post you need to use more specific selector, like .u-post-content p:first-letter. It should do the trick, if your text is wrapped in p tag.

...................................................
Sincerely,
Elena
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi Christian, > I just want to have the uppercase for the first letter of the post in the blog page and not to all the page including the header ... You use p:first-letter selector, which selects and styles the first letter of **every** p element on the page. If you want to style only post you need to use more specific selector, like .u-post-content p:first-letter. It should do the trick, if your text is wrapped in p tag. ................................................... Sincerely, Elena Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp

Last edited 25 December 2018 by Support Team

39 Posts

magann posted this 26 December 2018

Try this page https://css-tricks.com/snippets/css/drop-caps/

first-letter capital (css) on blog page

Company

Product

Themes & Templates

Nicepage

Web Design