Site Title and Site Description

Twenty Ten allows for a long title and a short description. But what if your site is the other way around. You have a short title but want a long description.

You don’t have to change your description to fit the allotted 220 pixels. Here is where you can change both.

Site Title

#site-title {
float:left;
font-size:30px;
line-height:36px;
margin:0 0 18px;
width:700px;
}

Change the width to what will allow your title to display on a single line. If you only need 200px for your title set it to:
width: 200px;
That will buy you 500 pixels to exchange for use with the site description.

Site Description

#site-description {
clear:right;
float:right;
font-style:italic;
margin:14px 0 18px;
width:220px;
}

The default setting is 220px for the description width. I can easily change this to 700 or 720px and use a longer description.

What about the size of the description font?

It is kind of small and being italic it isn’t easy for readers with let’s say “older eyes” to read it. There isn’t any font size declared in the site description. This means there is a default size that it is using. How do you make it bigger?

This is easy. Add the following:
font-size: 16px

Or whatever size you want.   16px is simply an example.

Be sure to do it inside the closing bracket for the site description. It would now look like this:

#site-description {
font-size: 16px;
clear:right;
float:right;
font-style:italic;
margin:14px 0 18px;
width:720px;
}

If you don’t like the italic simply remove the font-style:italic; or if you want to keep it in the code change it to font-style:normal;

Now you have a custom Site Title and Site Description for your blog.