MyBB Community Forums

Greetings,

Found a little problem with my mycode box in new reply/thread.

The textarea, in which you type your post, seems to overlap the right and bottom side of the mycode box.

Link: Carpe Noctem
Username: Test
Password: test10

Try to post a new reply in a forum, and watch the editor box being overlapped by the textarea box on the right and bottom side.

Any help is appreciated.

If it's of any help, here's the modified css stylesheet for the editor that I have on the server (jscripts/editor_themes/default/stylesheet.css):

.messageEditor {
	background: #303030;
	border: 1px solid #600000;
	padding: 3px;
}

.messageEditor .toolbar_container {
	height: 28px;
	padding: 2px;
}

.toolbar {
	height: 28px;
}

.messageEditor .toolbar_dropdown {
	margin-top: 3px;
	margin-right: 4px;
}

.messageEditor .toolbar_button {
	margin: 2px;
	height: 22px;
	width: 23px;
	float: left;
	display: block;
	z-index: 1;
}

.messageEditor .toolbar_button img, .messageEditor .toolbar_button span {
	width: 23px;
	height: 22px;
	float: left;
}

.messageEditor .toolbar_sprite {
	display: block;
	background: url('images/toolbar.gif') no-repeat;
}

.messageEditor .toolbar_button .toolbar_sprite_italic {
	background-position: -46px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_underline {
	background-position: -23px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_align_left {
	background-position: -69px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_align_center {
	background-position: -92px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_align_right {
	background-position: -115px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_align_justify {
	background-position: -138px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_list_num {
	background-position: -161px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_list_bullet {
	background-position: -184px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_image {
	background-position: -207px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_link {
	background-position: -230px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_email {
	background-position: -253px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_quote {
	background-position: -276px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_code {
	background-position: -299px 0;
}

.messageEditor .toolbar_button .toolbar_sprite_php {
	background-position: -322px 0;
}

.messageEditor .toolbar_button_close_tags {
	width: 90px;
}

.messageEditor .toolbar_button .toolbar_sprite_close_tags {
	width: 87px;
	background-position: -345px 0;
}

.messageEditor .toolbar_normal {
	background: #d8d8d8;
	border: 1px solid #600000;
}

.messageEditor .toolbar_hover {
	background: #902b2b;
	border: 1px solid #c1c1c1;
}

.messageEditor .toolbar_clicked {
	background: #902b2b;
	border: 1px dashed #c1c1c1;
	}

.messageEditor .toolbar_sep {
	background: url('images/separator.gif');
	width: 4px;
	height: 23px;
	margin: 2px;
	margin-top: 4px;
	float: left;
}

.messageEditor .toolbar_dropdown, .messageEditor .toolbar_dropdown_image {
	font-size: 11px;
	display: block;
	float: left;
	position: relative;
	z-index: 100;
	cursor: default;
}

.messageEditor .toolbar_dropdown {
	min-width: 130px;
}

/* IE 6 */
.messageEditor .toolbar_dropdown {
	width: 130px;
}

.messageEditor .toolbar_dropdown .editor_dropdown_label, .messageEditor .toolbar_dropdown_image .editor_dropdown_label {
	display: block;
}

.messageEditor .toolbar_dropdown .editor_dropdown_label {
	min-width: 120px;
	background: #d8d8d8;
	padding: 3px 4px;
	margin-right: 14px;
	border: 1px solid #600000;
	border-right: 0;
	height: 14px;
	overflow: hidden;
}

.messageEditor .toolbar_dropdown .editor_dropdown_arrow, .messageEditor .toolbar_dropdown_image .editor_dropdown_arrow {
	top: 0;
	position: absolute;
	right: 0;
	float: left;
	display: block;
	height: 20px;
	border: 1px solid #aaa;
	background: #efefef url(images/dropdown.gif) no-repeat center center;
	width: 12px;
}

.messageEditor .toolbar_dropdown_over .editor_dropdown_label, .messageEditor .editor_dropdown_menu_open .editor_dropdown_label {
	border-color: #c1c1c1;
	color: navy;
}

.messageEditor .toolbar_dropdown_over .editor_dropdown_arrow {
	background-color: #902b2b;
	border-color: #c1c1c1;
}

.messageEditor .toolbar_dropdown_image.toolbar_dropdown_over .editor_dropdown_label,
.messageEditor .toolbar_dropdown_image.toolbar_dropdown_over .editor_dropdown_arrow {
	background-color: #902b2b;
}

.messageEditor .editor_dropdown_menu_open .editor_dropdown_arrow {
	background-color: #902b2b;
	border-color: #600000;
}

.messageEditor .editor_dropdown_menu {
	margin: 0;
	padding: 0;
	margin-top: -3px;
	padding-bottom: 1px;
	top: 24px;
	left: 0;
	border: 1px solid #600000;
	position: absolute;
	width: 160px;
	background: #d8d8d8;
	z-index: 10000;
	max-height: 200px;
	overflow: auto;
	-moz-border-radius: 2px;
}

.messageEditor .toolbar_dropdown_image .editor_dropdown_menu {
	margin-top: -1px;
}

.messageEditor .editor_dropdown_menu li {
	list-style: none;
	padding: 3px 3px 3px 12px;
	margin: 0;
	position: relative;
	cursor: pointer;
}

.messageEditor .editor_dropdown_menu li.editor_dropdown_menu_item_active {
	background-image: url(images/dropdown2.gif);
	background-repeat: no-repeat;
	background-position: 2px center;	
}

.messageEditor .editor_dropdown_menu_title {
	background: #efefef;
	padding-left: 3px;
	border-bottom: 1px solid #aaa;
	color: #999;
	font-size: 10px;
	font-weight: bold;
}

.messageEditor .editor_dropdown_menu li.editor_dropdown_menu_item_over {
	background-color: #efefef;
	cursor: pointer;
}

.messageEditor .toolbar_button_color .editor_dropdown_menu {
	width: 153px;
	height: 98px;	
	padding: 1px;
	background: #fff;
	margin-left: -1px;
}

.messageEditor .toolbar_button_color li.editor_dropdown_color_item {
	float: left;
	padding: 3px;
	margin: 1px;
	width: 11px;
	height: 11px;
}

.messageEditor .toolbar_button_color a {
	width: 9px;
	height: 9px;
	display: block;
	border: 1px solid #606060;
}

.messageEditor .toolbar_button_color li.editor_dropdown_menu_item_active {
	background: #fff;
}

.messageEditor .toolbar_button_color {
	position: relative;
}

.messageEditor .editor_button_color_selected {
	position: absolute;
	z-index: 100;
	width: 16px;
	height: 4px;
	top: 15px;
	left: 3px;
	display: block;
}

.messageEditor .toolbar_button_color li.editor_dropdown_menu_item_over {
	border: 1px solid #600000;
	background: transparent;
	margin: 0px;	
}

.messageEditor .toolbar_button_with_arrow {
	width: 34px;
}

.messageEditor .toolbar_button_arrow {
	top: 0px;
	float: left;
	display: block;
	width: 8px;
	background: url(images/dropdown.gif) no-repeat center center;
	height: 20px;
	border: 1px solid transparent;
}

.messageEditor .toolbar_hover .toolbar_button_arrow, .messageEditor .toolbar_clicked .toolbar_button_arrow {
	border-left-color: #c1c1c1;
}

This is a common issue and is normally a browser issue. Right now it's showing fine for me and I'm using Chrome. What happens if you change the editor style in the theme settings to office 2007, does that change it??

It fixes it, but the initial change I wanted was due to the colours in the editor...

The problem lies in the stylesheet I think... not the browser (seems like the browsers hate me )

edit: eh, weird. I changed it back to default and the right and bottomside are shown as they should be.... how is that possible?!

edit2: and now they're not... so probably a browser issue indeed.

It is browser related. For example, if it "overhangs", just simply refresh the page and it's back in its box.

(2009-01-30, 06:30 PM)Tom.M Wrote: [ -> ]It is browser related. For example, if it "overhangs", just simply refresh the page and it's back in its box.

Ah right, thanks. But there is no solution to it?

Thanks,
-MV

Get a better browser, lol...

Safari (and Chrome, I guess, as they're built on WebKit) and Opera work perfect for me. Never really use FireFox - IE8 RC1 seems to work as well without any problems.

(2009-01-30, 07:37 PM)Tom.M Wrote: [ -> ]Get a better browser, lol...

Safari (and Chrome, I guess, as they're built on WebKit) and Opera work perfect for me. Never really use FireFox - IE8 RC1 seems to work as well without any problems.

Right. I thought Firefox was a good bet haha. I'll leave it at that.

Does anyone know the real mechanism causing the problem here? If ever a member comes up with it?