Post title size change

  • Resolved passegua

    (@passegua)


    9 years, 2 months ago

    I’m playing around using Jetpack CSS custom and I succeeded in enlarging both post body size fonts and post title size fonts.

    But the post title size is enlarged only when I am in home page, when I click on the post title to visit the actual page the post title size doesn’t enlarge. How could I change it?

    Home page: https://lnx.sinapsi.org/wordpress/ (title size 36px)
    Post page: https://lnx.sinapsi.org/wordpress/2015/12/28/ape-sulla-margherita/ (title size smaller, I’d like 36px as well))

    Here the customized CSS I put in:

    .entry-title a {
	color: #dd9933;
	font-size: 36px;
}

h1 {
	color: #dd9933;
	font-size: 36px;
}

.entry-content {
	font-size: 20px;
}

.site {
	margin: 0 auto;
	max-width: 960px;
	max-width: 80.571428571rem;
	overflow: hidden;
/* original max-width: 68.571428571rem; */
}

.site-content {
	float: left;
	width: 66.104166667%;
/* original width: 65.104166667%; */
}

.widget-area {
	float: right;
	width: 30.041666667%;
/* original width: 26.041666667%; */

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter passegua

    (@passegua)

    Anybody could help?

    Thanks!

    Hi

    To increase the font size on the title on individual posts you need to target

    .entry-header .entry-title

    So can do

    .entry-header .entry-title,
.entry-title a {
	color: #dd9933;
	font-size: 36px;
}

    ie add .entry-header .entry-title, to your first line – if you want them to be the same colour as the entry title links on the home page

    Or just

    .entry-header .entry-title {
	font-size: 36px;
}

    If you won’t want them the same colour.

    Jo

    Thread Starter passegua

    (@passegua)

    Great Jo!

    It works!

    Many many thanks!

    p.s. I should study more CSS indeed I don’t understand why you need to repeat .entry-title twice, comma separated, on 2 lines?

    .entry-header .entry-title,
.entry-title a {
	color: #dd9933;
	font-size: 36px;
}

    Each line targets a particular element

    You could have 

    .entry-header .entry-title {
	color: #dd9933;
	font-size: 36px;
}

.entry-title a {
	color: #dd9933;
	font-size: 36px;
}

    But it is more efficient, as the css to both elements is the same, to write it as you have above.

    The reason why it is .entry-header .entry-title rather than just .entry-title is because we need to be as specific as the original code to get the browser to use our code rather than the original theme code.

    Any book which introduces css will cover this. Good luck!

    Thread Starter passegua

    (@passegua)

    Thanks again for your help, best wishes!

    Thread Starter passegua

    (@passegua)

    I wonder if you could help me in solving this other issue about Chrome browser?

    https://www.ads-software.com/support/topic/css-shows-well-in-firefox-and-edge-but-not-in-chrome?replies=6

    Many thanks.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Post title size change’ is closed to new replies.

Tags