News:

Want to get involved in developing SMF, then why not lend a hand on our github!

Main Menu

Visuals/HTML: Quick Reply Textarea - cols value too high / wide

Started by Kissaki, June 10, 2012, 09:24:14 AM

Previous topic - Next topic

Kissaki

In the default templates (core & default, Display.template and GenericControls.template) the textarea for quick replies has the parameter cols set to 600.

Unfortunately, the cols value specifies the width in number of columns, and not in pixels (as the coder probably intended to specify it in).

Hence, the default themes set / correct the width via CSS:
(default:)
#quickReplyOptions form textarea
{
width: 635px;
}


This may work, but makes the HTML source inconsistent with the displayed result.
Also, custom themes can not simply leave the CSS definition out as no sane and usable result will be displayed.

I'd expect a cols value of maximum 180, which results in a width of 1200 px here.
A close to 600 px value is 83, which is 601 px here.
82 => 594 px.

Arantor


Kissaki


Arantor

Microsoft isn't going to fix any issues in IE8. That's why SMF had to implement this slightly bizarre setup, specifically to avoid all the issues people were having with IE8.

Do a search around here for 'jumping text bug' and you'll see all the problems people were having. This hack (and no mistake, it is a hack) fixes how IE8 processes the textarea and it doesn't misbehave. From a theme perspective, yes, it sucks but it sucks less than having to deal with users complaining about jumping text in a textbox.

(This isn't an SMF bug. It is working as the developers intended. It is not their fault that IE8 doesn't work properly.)

Antechinus

Which reminds me, I must try testing IE8 with the cols value empty (cols=""). Cols is required in the HTML for validation, but having the value empty still validates and it may work.

The IE8 bug was triggered if the width setting gave a greater width than the cols setting. For example, if each col is 10px wide and you set cols to 100, that gives 1000px. If you were using the theme on a 1920 monitor and the textarea width in the css was 80%, that means the textarea wants to be wider than 100 cols. All other browsers just go with the css, but IE8 goes bonkers.

If the cols value is empty, there are no validation problems and it MIGHT fool IE8 into thinking everything was ok, since it wouldn't have a cols value to conflict with the width.

Arantor

cols being empty is not valid for HTML5 so unfortunately it really must stay like that until IE8 is no longer supported.

Advertisement: