Certainly. You could change your earlier CSS to include that specification as well. Quick question though: would you be okay getting rid of the big first letter effect on mobile? Because unless we do, there’s a lot of adjusting that would be involved to make the layout work consistently.
Thread Starter
mch210
(@mch210)
Appreciate the help. Sure. I don’t need to have that on mobile.
Okay, here’s the code you can add to make the font smaller on mobiles (it will maintain the drop cap but will make it smaller as well):
@media only screen and (max-width: 768px) {
.single-post .entry-content p {
font-size: 1.4rem;
}
.format-standard:not(.post-password-required) .entry-content > p:not(.no-emphasis):first-of-type:first-letter,
.page:not(.post-password-required) .entry-content > p:not(.no-emphasis):first-of-type:first-letter,
.emphasis:first-letter {
font-size: 50px;
}
}
I hope that helps 🙂
Thread Starter
mch210
(@mch210)
Thank you, that is the perfect size! It’s probably my fault for not being more clear, but I was hoping to make the font size smaller not only when you click on a single post, but also when you are on the home screen or when you click a category through the menu. Right now the font size only changed in single posts.
Is there a way to change the font size in the body of the post for not only single posts but also on the homescreen and categories?
Thank you! The help is really much appreciated!
Thread Starter
mch210
(@mch210)
Along with my message above, I just realized that I am having similar problems with the post titles on my desktop but didn’t realize it because I have my browser screen minimized to 80%. But with normal browser screen size my site titles are also blocking some menu options on desktop. Is there CSS to make the font size smaller for post title’s on desktops too? And I would also appreciate CSS to make the font size smaller in the body of posts on desktop (for the entire website-single post, home screen and categories).
I promise after this I am done! If there is anywhere to donate for your great help let me know! To sum up:
1) CSS for mobile to make the font size smaller in the body of the post for the entire website (homescreen, single post, categories) and not only single post.
2) CSS for desktop to make the post title font size smaller
3) CSS for desktop to make the body of the post font size smaller for entire website (homescreen, single post, categories)
I can’t tell you how much appreciate this! And again, let me know if there is any way to donate/support for all your help!
Actually the best place to go for extensive customization is to an individual contractor. You can find some through UpWork.com. We can help with bugs, like when your title is overlapping, and with a minor change like making the font smaller on mobile, but lists of customizations are outside our scope of support.
But, you take a look at the CSS we gave you and adjust it as needed. For example, if you want it to be resized on all screens, try copying it, and taking out the first line that says screen max-width. And then take out the ending bracket too.
And if you don’t want it just on “.single-post” take out that part, too, so it just applies to .entry-content.
This guide may help:
https://en.support.wordpress.com/custom-design/css-basics/
Thread Starter
mch210
(@mch210)
Ok. That makes sense. I was able to fix the issue of the post title on my desktop with your advice to adjust the CSS and also making the font smaller everywhere.
Thank you so much!!!!!!!!!! I can’t thank you enough!!!!!!!!!!!
-
This reply was modified 2 years, 6 months ago by
mch210.
-
This reply was modified 2 years, 6 months ago by mch210.
