H2 not working

Resolved fluffybunnies82
(@fluffybunnies82)

13 years, 3 months ago

I’ve made some modifications to my theme (pistachio) to add threaded comments to it. I’ve added some code from the default theme to my comments.php file and also to my stylesheet. Now I’m having a little problem with a style not working. There are two things that are supposed to be in H2 and they’re showing the same as the normal text and I’m not sure why.

Here’s a post on my blog: http://www.gleefulthings.com/blog/?p=752

“Leave a Reply” and “4 Responses to …….” are supposed to be in H2

Please help! 🙂

Viewing 7 replies - 1 through 7 (of 7 total)

Thread Starter

(@fluffybunnies82)

Here’s my stylesheet. Comment related stuff is at the bottom.

/*  

Theme Name: Pistachio

Theme URI:

Description: 3 Column, green falvored theme. 

Version: 1.0

Author: Wessley Roche

Author URI: 

*/

/* @group Reset */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {

	margin: 0;

	padding: 0;

	border: 0;

	outline: 0;

	font-weight: inherit;

	font-style: inherit;

	font-size: 100%;

	font-family: inherit;

	vertical-align: baseline;

}

:focus {

	outline: 0;

}

body {

	line-height: 1;

	color: black;

	background: white;

}

ol, ul {

	list-style: none;

}

table {

	border-collapse: separate;

	border-spacing: 0;

}

caption, th, td {

	text-align: left;

	font-weight: normal;

}

blockquote:before, blockquote:after, q:before, q:after {

	content: "";

}

blockquote, q {

	quotes: "" "";

}

/* @end */

/* @group Defaults */

strong{

	font-weight: bold;

}

em{

	font-style: italic;

}

ol{

	list-style-type: decimal;

	padding-left: 2em;

}

.the_content ul{

	list-style: disc;

	padding-left: 2em;

}

p{

	text-align: justify;

	margin: 1em 0;

}

blockquote{

	font-style: italic;

	font-family: Georgia, "Times New Roman", Times, serif;

	border-left: 5px solid #E3EBA3;

	padding-left: 10px;

	margin-left: 20px;

	margin-right: 20px;

}

code{

	font-family: "Courier New", Courier, mono;

}

/* @end */

/* @group Clearfix */

.clearfix:after {

	content: ".";

	display: block;

	height: 0;

	clear: both;

	visibility: hidden;

}

.clearfix { display: inline-block; }

/* Hides from IE-mac \*/

* html .clearfix { height: 1%; }

.clearfix { display: block; }

/* End hide from IE-mac */

/* @end */

/* @group Main */

html body{

	background: #0c0c0c url(images/background_stripes.gif) top left repeat;

	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;

	color: #222;

}

a:link, a:visited{

	color: #92a400;

	text-decoration: none;

}

a:hover, a:active{

	text-decoration: underline;

}

.page{

	width: 960px;

	margin: 50px auto;

}

/* @end */

/* @group Header */

.menu{

	background: url(images/rounded_block_top.gif) top left no-repeat;

	line-height: 1em;

	font-size: 0.75em; /* 12px */

	text-transform: uppercase;

	padding: 0 10px;

}

ul.pages li{

	display: inline; /* IE6 double margin fix */

	float: left;

	margin: 0 10px;

}

ul.pages li a{

	display: block;

	padding: 1.5em 0;

}

ul.pages li a:link,

ul.pages li a:visited{

	color: #222;

}

ul.pages li.current_page_item{

	background: url(images/current_page_item.gif) center top no-repeat;

}

ul.pages li.subscribe{

	float: right;

}

ul.pages li.subscribe a{

	background: url(http://www.gleefulthings.com/blog/wp-content/themes/pistachio/images/tinyicons/rss.gif) left center no-repeat;

padding-left: 24px;

}

ul.pages li.facebook{

	float: right;

}

ul.pages li.facebook a{

	background: url(http://www.gleefulthings.com/blog/wp-content/themes/pistachio/images/tinyicons/facebook.gif) left center no-repeat;

padding-left: 24px;

}

ul.pages li.twitter{

	float: right;

}

ul.pages li.twitter a{

	background: url(http://www.gleefulthings.com/blog/wp-content/themes/pistachio/images/tinyicons/twitter.gif) left center no-repeat;

padding-left: 24px;

}

ul.pages li.flickr{

	float: right;

}

ul.pages li.flickr a{

	background: url(http://www.gleefulthings.com/blog/wp-content/themes/pistachio/images/tinyicons/flickr.gif) left center no-repeat;

padding-left: 24px;

}

ul.pages li.youtube{

	float: right;

}

ul.pages li.youtube a{

	background: url(http://www.gleefulthings.com/blog/wp-content/themes/pistachio/images/tinyicons/youtube.gif) left center no-repeat;

padding-left: 24px;

}

ul.pages li.etsy{

	float: left;

}

ul.pages li.etsy a{

	background: url(http://www.gleefulthings.com/blog/wp-content/themes/pistachio/images/tinyicons/etsy.gif) left center no-repeat;

padding-left: 24px;

}

ul.pages li.ravelry{

	float: left;

}

ul.pages li.ravelry a{

	background: url(http://www.gleefulthings.com/blog/wp-content/themes/pistachio/images/tinyicons/ravelry.gif) left center no-repeat;

padding-left: 24px;

}

.header{

	background: #fff url(images/header.gif) top left no-repeat;

	height: 200px;

}

.header h1{

	font-size: 48px;

	margin-bottom: 10px;

	font-weight: bold;

}

.header h1 a:link,

.header h1 a:visited{

	color: #000;

}

.header p.blog_description{

	margin: 0;

	color: #fff;

}

/* @end */

/* @group Content */

.content{

	background: #FFF;

	padding: 20px 0 20px 20px;

	font-size: 0.8125em; /* 13px */

}

.main_column{

	width: 500px;

	float: left;

}

.sidebar_column{

	float: left;

	width: 410px;

	margin-left: 20px;

}

.sidebar_left,

.sidebar_right{

	float: left;

	width: 190px;

}

.sidebar_right{

	margin-left: 20px;

}

.post{

	margin-bottom: 20px;

}

.post h2,

.comments h2,

.yourcomment h2{

	font-size: 1.8416em; /* 24px */

	line-height: 1.25em; /* 30px */

}

.post h2 a:link,

.post h2 a:visited{

	color: #ff9933;

}

ul.postmeta{

	line-height: 1.5384em; /* 20px */

}

ul.postmeta li,

ul.postmeta li a:link,

ul.postmeta li a:visited{

	color: #777;

	font-size: 12px;

}

ul.postmeta li{

	float: left;

	margin-right: 20px;

	padding-left: 16px;

	white-space: normal;

}

ul.postmeta li.date{

	background: url(images/icon_calendar.gif) left center no-repeat;

}

ul.postmeta li.author{

	background: url(images/icon_user.gif) left center no-repeat;

}

ul.postmeta li.category{

	background: url(images/icon_tag.gif) left center no-repeat;

}

ul.postmeta li.comments{

	background: url(images/icon_comments.gif) left center no-repeat;

}

ul.postmeta li.edit{

	background: url(images/icon_edit.gif) left center no-repeat;

}

.the_content{

	line-height: 1.5384em; /* 20px */

}

.alignleft{

	float: left;

	margin: 3px 10px 5px 0;

}

.alignright{

	float: right;

	margin: 3px 0 5px 10px;

}

.aligncenter{

	margin: 0 auto;

	display: block;

}

.the_content h3{

	font-size: 1.2307em;

	line-height: 1.25em;

	margin-top: 20px;

	margin-bottom: 10px;

}

.wp-smiley{

	vertical-align: sub; /* Aligns the smileys to the text */

}

h2.pagetitle{

	margin-bottom: 20px;

	font-size: 18px;

	color: #999;

}

/* @end */

/* @group Widgets */

.widget{

	margin-bottom: 20px;

	line-height: 1.5384em; /* 20px */

}

h2.widgettitle{

	font-size: 1.2307em;

	margin-bottom: 12px;

	color: #92a400;

	background: url(images/sidebar_h2_background.gif) top left no-repeat;

	padding: 5px 10px;

}

.widget ul li{

	padding-left: 16px;

	background: url(images/icon_arrow.gif) 0 0.3846em no-repeat;

}

.widget_search{

	height: 30px;

	background: url(images/search_left.gif) top right no-repeat;

}

.widget_search br{

	display: none;

}

.widget_search input{

	float: right;

	width: 65px;

	font-size: 1em;

	vertical-align: middle;

	background: url(images/search_right.gif) top right no-repeat;

	height: 30px;

	padding-top: 30px;

	overflow: hidden;

	width: 40px;

	border: none;

	color: transparent;

}

.widget_search input#s{

	float: left;

	width: 140px;

	margin-left: 0;

	background: url(images/search_left.gif) top left no-repeat;

	height: 16px;

	padding: 8px 0 8px 8px;

	font-size: 13px;

	border: none;

	color: #000;

}

table#wp-calendar{

	width: 99%;

}

table#wp-calendar caption{

	font-weight: bold;

	text-align: center;

	padding-bottom: 5px;

}

.widget_links ul li{

	background-image: url(images/icon_world.gif);

}

.widget_categories ul li{

	background-image: url(images/icon_tag.gif);

}

.widget_archive ul li{

	background-image: url(images/icon_folder.gif);

}

.widget_pages ul li{

	background-image: url(images/icon_document.gif);

}

.widget_recent_entries ul li{

	background-image: url(images/icon_clock.gif);

}

.widget_recent_comments ul li{

	background-image: url(images/icon_comments.gif);

}

.widget_meta ul li{

	background-image: url(images/icon_wrench.gif);

}

/* @end */

/* @group Footer */

.footer{

	padding: 20px;

	background: url(images/rounded_block_bottom.gif) bottom left no-repeat;

	font-size: 0.8125em;

	line-height: 1.5384em; /* 20px */

}

.footer p{

	margin: 0;

}

/* @end */

/* @group Comments */

ul.commentlist{

	margin-bottom: 30px;

}

ul.commentlist li{

	margin-top: 10px;

	margin-bottom: 30px;

}

.commentmeta{

	margin-bottom: 10px;

}

.gravatar{

	float: left;

}

.commentinfo{

	margin-left: 42px;

}

.comment_author{

	display: block;

	font-size: 15px;

	margin-bottom: 4px;

}

.comment_date{

	color: #888;

	font-size: 12px;

}

.the_comment{

	background: #e5e5e5 url(images/comment_top.gif) top left no-repeat;

	padding: 10px 15px 1px 15px;

	line-height: 1.5384em; /* 20px */

}

.highlight .the_comment{

	background: #e0e99a url(images/comment_top_hl.gif) top left no-repeat;

}

.yourcomment form{

	margin-top: 20px;

}

.yourcomment form textarea{

	width: 99%;

	font-size: 1em;

	height: 10em;

}

.yourcomment form input{

	font-size: 1em;

}

.yourcomment label{

	margin-left: 5px;

}

.yourcomment label small{

	color: #999;

}

ul.pingbacks{

	line-height: 1.5384em; /* 20px */

	margin-top: 10px;

	margin-bottom: 30px;

}

ul.pingbacks li{

	padding-left: 16px;

	background: url(images/icon_arrow.gif) 0 0.3846em no-repeat;

}

/* @end */

/* @group Archives */

.archives ul{

	list-style: none;

}

.archives span.the_day{

	float: left;

	width: 2em;

}

/* @end */

/* Begin Comments*/
.alt {
	margin: 0;
	padding: 10px;
	}

.commentlist li.depth-1 {background: #ffffff; border-bottom: 1px dashed #999;}

.comment-author {background: #f1f5d2; padding: 10px 10px 1px 10px;}
.comment-meta {background: #f1f5d2; padding: 10px 10px 10px 10px;}

.commentlist {
	padding: 0;
	text-align: justify;
	}

.commentlist li {
	margin: 15px 0 10px;
	padding: 5px 5px 10px 10px;
	list-style: none;

	}
.commentlist li ul li {
	margin-right: -5px;
	margin-left: 10px;
}

.commentlist p {
	margin: 10px 5px 10px 0;
}
.children { padding: 0; }

#commentform p {
	margin: 5px 0;
	}

.nocomments {
	text-align: center;
	margin: 0;
	padding: 0;
	}

.commentmetadata {
	margin: 0;
	display: block;
	}
/* End Comments */

#commentform input {
	width: 170px;
	padding: 2px;
	margin: 5px 5px 1px 0;
	}

#commentform {
	margin: 5px 10px 0 0;
	}
#commentform textarea {
	width: 100%;
	padding: 2px;
	}
#respond:after {
		content: ".";
	    display: block;
	    height: 0;
	    clear: both;
	    visibility: hidden;
	}
#commentform #submit {
	margin: 0 0 5px auto;
	float: right;
	}

Emil Uzelac

(@emiluzelac)

13 years, 3 months ago

They are both H2, however font-size: 100% needs to be changed.

Login to your WP Dashboard or via FTP however you want. Go to http://www.gleefulthings.com/blog/wp-content/themes/pistachio/style.css and locate:

H2 {
    font-size: 100; and change to font-size: 18px;
}

Results:
http://i.imgur.com/MAwMn.jpg

Emil Uzelac

(@emiluzelac)

13 years, 3 months ago

I’m taking that back. Add this instead:

#comments h2, #respond h2 {
    font-size: 18px;
}

font-size: 100% is actually your CSS reset.

Thread Starter

fluffybunnies82

(@fluffybunnies82)

13 years, 3 months ago

Thank you so much! It worked on Leave a Reply but not on the number of responses.

Emil Uzelac

(@emiluzelac)

13 years, 3 months ago

How about this:

div#comments h2, #respond h2 {
     font-size: 18px;
}

Thread Starter

fluffybunnies82

(@fluffybunnies82)

13 years, 3 months ago

That still didn’t work but I ended up fixing it by editing the comments.php file.

The line used to say:
<h2 id="comments"><?php comments_number('No Responses', 'One Response', '% Responses' );?> to “<?php the_title(); ?>”</h2>

and I changed it to:
<div id="comments"><h2><?php comments_number('No Responses', 'One Response', '% Responses' );?> to “<?php the_title(); ?>”</h2></div>

I hope that doesn’t mess anything else up.. I don’t know if that ID effects anything else.

Thank you so much for your help! I really appreciate it! 🙂

Emil Uzelac

(@emiluzelac)

13 years, 3 months ago

Yeah, you fixed this actually, good eye, super catch, bravo!!!! I do this on daily basis and didn’t see something obvious from my end.

Cheers,
Emil

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘H2 not working’ is closed to new replies.

H2 not working

Topics

Topics with no replies

Non-support topics

Resolved topics

Unresolved topics

All topics