How can I change the page title text size in Duster?

janeackroyd · Member · Jun 21, 2011 at 8:34 pm
Copy link

Add topic to favorites
My question is related to my site which is: http://janeackroyd.com

I have been trying to change the size of the page title that appears in rather a large text on each of my pages (under the menu bar, above the images) but have not been able to work out how to do it despite spending too much time on it…

I want to make the page title (I assume that is what it is called) to about 18 points or smaller than the site title text (Jane Ackroyd).

Can somebody help me and instruct me what I need to do to css to make this huge text smaller?

Thanks in advance!

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Jun 21, 2011 at 8:46 pm
Copy link
Do you have the custom design (CSS) upgrade?
janeackroyd · Member · Jun 21, 2011 at 9:25 pm
Copy link
yes i do.
thesacredpath · Member · Jun 21, 2011 at 9:34 pm
Copy link
The font size is set here:
```
.singular .entry-title {
font-size: 36px;
}
```
Never set web font sizes in points. em units are best, but you can set them also in pixels, but that is less desirable from an accessibility standpoint. Right now it is 36px. If you go too small, then the title just becomes an orphaned bit of text lost at the top of the page. The title works now with the generous white space because it is larger. If you go smaller then you will also have to play around with margins and padding so that it is not orphaned by all the white space.
janeackroyd · Member · Jun 21, 2011 at 9:47 pm
Copy link
thanks thesacredpath.

its worked. and thanks for the tip re. the text and the background white space issue issue too!
janeackroyd · Member · Jun 21, 2011 at 9:55 pm
Copy link
thesacredpath,

one more thing, how can i adjust the spacing between the menu bar and the page title text?

thanks in advance!
thesacredpath · Member · Jun 21, 2011 at 10:02 pm
Copy link
Use the following and adjust the top padding. I set it a zero so you can work up from there to get it to look the way you want it.
```
.singular.page .hentry {
padding-top: 0;
}
```
janeackroyd · Member · Jun 21, 2011 at 10:10 pm
Copy link
great. it works of course.

thanks so much for your help. really appreciate it.
thesacredpath · Member · Jun 21, 2011 at 10:19 pm
Copy link
You are welcome.
1tess · Moderator Emeritus · Jun 22, 2011 at 12:52 am
Copy link
For future reference this thread is now in the CSS forum.
t

No items found.