Dropcap in single blog post content without shortcode

Support
#1

Hello Team!

I am trying to automatically display dropcaps in my blog posts without the need to add the related shortcode every time I write. For that, I use the following CSS snippet, and I hope you guys can help me refine it:

.single-post div.entry-content p:first-child:first-letter {
float:left;
font-size:4em;
color: #363030;
margin-right:0.10em;
line-height:90%;
text-shadow: none;
}

With this code, however, the dropcap is not only applied to the content of the post as desired (see ) but to all further elements styled as “paragraph” (see ) while the intended style in this case would be

Would you see any way to solve this issue?

Thanks a lot to everyone

#2

Hi There,

Please update your custom CSS to this:

.single-post div.entry-content > p:first-child:first-letter { 
    float:left; 
    font-size:4em; 
    color: #363030; 
    margin-right:0.10em; 
    line-height:90%; 
    text-shadow: none; 
}
#3

Hi Thai,

And of course that worked like a charm! So simple!

Thanks a lot guys

David

#4

You’re welcome :slight_smile: