Here's the deal. I'm trying to create a WordPress theme using ThemesPress.com. The problem I'm having is with the post title (H2, I guess). I can't seem to edit it. I want to enlarge it, but the only to do that is by enlarging the whole post. I can't isolate just the post title.
Here's my code:

/*
Theme Name: CopyBlog
Theme URI: http://jonathanbostrom.com/
Description: Copywriting blog
Version: 1.0
Author: Jonathan Bostrom
Author URI: http://jonathanbostrom.com/
*/
#wrapper
{
width: 700px;
margin: 0 auto;
overflow: hidden;
}
*
{
padding: 0;
margin: 0;
}

#sidebar
{
width: 28%;
margin-left: 70%;
}
#footer
{
background-color: #F6C760;
clear: both;
padding: 20px 20px 20px 7.5%;
margin-top: 2em;
height: 3em;
color: #804A0F;
}
body
{
font-family: 'Trebuchet MS', Arial, Verdana, Sans-Serif;
}
body
{
font-size: 14px;
}
#content
{
width: 70%;
float: left;
}
#h2
{
text-size: 30px;
}
.post
{
margin-bottom: 2.2em;
}
.post
{
margin-bottom: 25px;
color: #4A2C00;
padding-left: 5px;
font-size: 0.8em;
}

h2
{
font-size: 1em;
border-bottom: 1px solid #FFA100;
}

h2 a:hover, h2 a:visited, h2 a
{
text-decoration: none;
color: #FFA100;
font-size: 1em;
}

.entry
{
margin-top: 10px;
margin-bottom: 15px;
}

.postmetadata
{
padding: 2px;
font-size: 0.8em;
border-top: 1px solid #FADA96;
}

.postmetadata a
{
color: #4a2c00;
}
.post p
{
line-height: 1.4em;
margin-bottom: 1em;
}


blockquote
{
margin: 1em 1.5em;
padding: 1em 1.5em;
border: 1px solid #657EB6;
background: #FCF1E2 url(images/blockquote.png) no-repeat scroll top left;
}

.post li
{
margin-left: 20px;
}

.post ul
{
list-style-image: url(images/listitem.png);
list-style-type: bullet;
margin-bottom: 10px;
}

acronym, abbr, span.caps
{
cursor: help;
}

acronym, abbr
{
border-bottom: 1px dashed #999;
}

blockquote cite
{
margin: 5px 0 0;
display: block;
}

.center
{
text-align: center;
}

a img
{
border: none;
}

h3
{
margin-top: 1.5em;
font-size: 1.1em;
}

h4
{
margin-top: 1.2em;
font-size: 1.1em;
}

h5
{
margin-top: 1em;
font-size: 1em;
}

.post a
{
color: #bd492a;
}


.navigation
{
display: block;
margin-top: 10px;
margin-bottom: 40px;
}

.alignleft
{
float: left;
text-align: left;
width: 50%;
}

.alignright
{
float: right;
text-align: right;
width: 50%;
}
.entrytext .postmetadata
{
font-size: 1.1em;
background-color: #FDE5C3;
width: 70%;
margin: 2em auto3.5em auto;
border: 1px dotted #e9b17b;
padding: 5px;
padding-left: 45px;
background: #FDE5C3 url(images/metadata.png) no-repeat scroll top left;
}
ol.commentlist
{
width: 90%;
margin: 0 auto;
}

ol.commentlist li
{
margin-bottom: 1.5em;
border: 1px solid #c69835;
padding: 5px;
background-color: #f5de74;
}

ol.commentlist li.alt
{
background-color: #fdf6a7;
}

ol.commentlist a
{
color: #bd492a;
}

small.commentmetadata
{
font-size: 0.8em;
margin-bottom: 1em;
display: block;
}



Any thoughts?

Thanks!

h2
{
font-size: 1.5em;

That will make it 50% larger.

Thanks for the reply!

It's odd, I just tried that, but it didn't change a thing. Is there some sort of inconsistency in my code or something?

(I'm really new to all this stuff.)


Thanks!

create a

.post h2
{
font-size: 1.5em;
}

This will make only the posts H2 50% larger. You can of course add any other styling.

Skinny

That should work, too.

#h2
{
text-size: 30px;
}

What your code probably looks like is:

<h2 id="h2">

or something similar

The id tag takes precedence unless !important is applied to a class or the element itself.

so change that size there and it should change

Text-size doesn't exist. You want font-size.

that would be another problem with his code then lol

It would have been easier to spot if the threadstarter had used the code tags.