1 reply [Last post]
gabeanderson
Offline
newbie
Last seen: 13 years 20 weeks ago
Timezone: GMT-4
Joined: 2006-06-30
Posts: 1
Points: 0

Hi There-

I use this background image:

http://support.articulate.com/images/_blue-bar.gif

..as part of this style:

	.bluebar {
	font-size:9pt;
	font-family: Helvetica, Tahoma, Arial;
	color:#FFFFFF;
	font-weight:bold;
	background-image:url(http://support.articulate.com/images/_blue-bar.gif);
	line-height:190%;
	padding:2px;
	margin-top:10px;
	text-align:left;
	letter-spacing: 0em;
	text-indent: 5px;
		}

It works fine 9 times out of 10, like this:

http://support.articulate.com/kb/000538.php

...but there are certain cases, when my titles are too long, that it looks bad when it breaks to a second line, like this:

http://support.articulate.com/kb/000556.php

Any suggestions?? I have one template for ALL 200 or so Knowledge Base entries, so manually assigning a different style on a case-by-case basis is not an option. Is there a way to account for this in CSS? Or a conditional way to display a larger background? Or should I just modify the background image to account for this?

Thanks!

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 5 years 5 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

background image problem in some cases, but not others

You should set the repeat of the bg image to repeat-x and then make the image twice as deep as it is now so that it covers the area of two lines high.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference