Background Image under Banner title text

[MikeFloutier 0]

Hi,I'm finding that if the browser doesn't have the preferred font for my banner's title text then the background image's height tends to vary according to which font IS selected as an alternate.In this case I want it to use "comic sams MS" but if that's not available then "verdana" is next on the list and this, being shorter in height (presumably), leaves a gap between the bottom of the background image and the banner's border.My present method of making the background image fill the gap (top & bottom) between the text and the banner's borders is to use padding.THis is the CSS:

#main-title {margin-left: 250px;margin-right: 250px;padding-left: 11px;padding-right: 10px;font-weight: 300;font-size: 4.0em;text-align: center;font-family: "comic sans MS", verdana, arial, helvetica, sans-serif;background-image: url(Images/centre-image.jpg);border-left: 1px #b90970 solid;border-right: 1px #b90970 solid;padding-top: 10px;padding-bottom: 10px;}

And this is a link:http://www.exhortations.co.uk/I could just drop the "comic sans MS" but I much prefer it so I dont want to.I could also convert the banner to an image but I dont think that would work with it's width re-sizing capabilities.Any ideas as to how I can get a fixed height on the background image so any text can go on top without mucking things up would be much appreciated.ThanksMike

[BiteMe 0]

BWHAHAHAHAHAHAHComic Sans. Dont use comic sans if you want to be taken seriously. Simply.As.That.Comic sans

[MikeFloutier 0]

BWHAHAHAHAHAHAHComic Sans. Dont use comic sans if you want to be taken seriously. Simply.As.That.Comic sans

Hahaha!Thanks BiteMeOk, you can see what a newbie I am; I had no idea what I was doing. I just liked the font.So,1. Any suggestions for a similar font, and2. Any ideas about my original questionThanksMike

[jlhaslip 1]

#main-title {margin: 0 auto;text-align:center;font-weight: 300;font-size: 4.0em; ==> set to a specific px height ???text-align: center;font-family:"comic sans MS", verdana, arial, helvetica, sans-serif;background-image: url(Images/centre-image.jpg);border-left: 1px #b90970 solid;border-right: 1px #b90970 solid;padding: 10px;}

I might suggest trying to set a specific height for the text. I understand the reasons for the usage of em's but if the substitute font is smaller, this may solve the problem. Also, have you played with the margins and padding to see if these are affecting the results?

[MikeFloutier 0]

Thanks,I really thought you had it there with the px instead of em thing; "surely that will control the height of the font" I thought.For some reason comis sans MS seems to add some of it's own padding around the font (at least that's how it seems to me). Also I've tried messing with margin and padding but they either introduce a new problem or exaggerate the existing one.I think I'll have to bite the bullet (haha BiteMe) and ditch the offending font.Mike

[jlhaslip 1]

Perhaps that is why BiteMe doesn't like it? Glad to have had the opportunity to attempt to help.