UseBB Community

A modest contribution to solve a problem with Safari.

Safari (I use version 2.0.4 with Mac OS X 10.4.9) has a problem displaying topics with long lines of code :
http://www.xs4all.nl/~ronaldpr/usebb/safari_problem.jpg

This can be solved by adding to styles.css :

table.maintable pre.code {
	/* Fix for Safari */
	width: 502px;
}

This code may fix the problem for Safari but creates a new one in IE where you can't see the text if it's one line because the scroll bar covers it.

As far as I know these browsers should just behave as Gecko does, if there is an overflow, hide it and use scrollbars. Safari nor IE seem to do this.

If you have another solution, let me know.

I have no IE here to check this myself, but does adding extra padding at the bottom solve the scroll bar problem in IE?

table.maintable pre.code {
	width: 502px;
	padding: 5px 5px 20px 5px;
}

(The 20 pixels is just a guess, maybe a few pixels more are needed or maybe less pixels are sufficient.)

If the extra padding at the bottom works for IE, it could possibly be applied in this way for IE only: (the code in full with the original style for pre.code included)

pre.code {
	display: block;
	margin: 0 25px 0 25px;
	padding: 5px;
	font-family: monospace;
	color: #7F0000;
	background-color: #FFF;
	border: 1px solid #BFBFBF;
	overflow: auto;
	font-size: 8pt;
}
table.maintable pre.code {
	width: 502px;
	padding: 5px 5px 20px 5px;
}
html>body table.maintable pre.code {
	padding: 5px;
}

Applied in CVS. Thanks for reporting and your help.

Unfortunately too late for 1.0.7, I discovered that with this fix there is now (or still, depending on the browser) a problem when someone quotes part of a message including code. This can be solved by adding an extra fixed width for code in a quote:

table.maintable blockquote.quote pre.code {
	width: 430px;
}

The complete fix will thus be:

table.maintable pre.code {
	width: 502px;
	padding: 5px 5px 20px 5px;
}
html>body table.maintable pre.code {
	padding: 5px;
}
table.maintable blockquote.quote pre.code {
	width: 430px;
}

Of course, there will again be a problem when someone quotes a quote including code, but that is probably where a moderator's job starts.

Applied to CVS.

Dietrich wrote

Applied to CVS.

Hi Dietrich,

Don't get this wrong but wouldn't it be easier for the average user to have access to a simple mod type file to insert or modify a few lines of code? The above code change could have been a little more explicit (open styles.css, find blah, blah, blah around line X and insert below: {code}.

The average Joe can't make sense of CVS files to see what was changed or added.

I've switched over 15 phpBB users who wanted a good board program and simple to modify (phpBB3 is quite difficult for most people, me included) and the CVS is their only gripe.

Just a thought,
Gene

See http://usebb.sourceforge.net/cvs/. The checkins mailing list even contains diffs for each change.