hey

when you have really long descriptions or many file extensions for Filefield module, the layout of the filefield fieldset / tab expands outwards of the regular node-form.
the same happens with FileField ImageField module Alt and Description fields.
the problem is not solved with FileField UI Extras module.
and the problem becomes worse with Admin module enabled, and expanded...

but this patch / code does solve it ;)

at least for Firefox / Chrome
older versions of IE might have difficulty applying max-width and max-height CSS properties.

/* filefield */
div.node-form div.vertical-tabs-panes div.description {
  overflow: auto;
  max-width: 650px;
  max-height: 80px;
  word-wrap: break-word;
}
div.node-form div.vertical-tabs-panes div.filefield-element div.description {
  overflow: auto;
  max-width: 550px;
  max-height: 80px;
  word-wrap: break-word;
}
div.node-form div.vertical-tabs-panes div.filefield-element fieldset.fieldset-additional-info div.description {
  overflow: auto;
  max-width: 400px;
  max-height: 35px;
  word-wrap: break-word;
}
/* filefield (admin module expanded) */
body.admin-expanded div.node-form div.vertical-tabs-panes div.description {
  overflow: auto;
  max-width: 500px;
  max-height: 80px;
  word-wrap: break-word;
}
body.admin-expanded div.node-form div.vertical-tabs-panes div.filefield-element div.description {
  overflow: auto;
  max-width: 400px;
  max-height: 80px;
  word-wrap: break-word;
}
body.admin-expanded div.node-form div.vertical-tabs-panes div.filefield-element fieldset.fieldset-additional-info div.description {
  overflow: auto;
  max-width: 350px;
  max-height: 35px;
  word-wrap: break-word;
}

Comments

Status:Active» Patch (to be ported)

additionally, using this

div.node-form div.vertical-tabs-panes div.filefield-element fieldset.fieldset-additional-info div.description {
  overflow: scroll;
}
body.admin-expanded div.node-form div.vertical-tabs-panes div.filefield-element fieldset.fieldset-additional-info div.description {
  overflow: scroll;
}

instead of auto, will force the scroll bars to show. sometimes they don't for Alt and Description fields.

StatusFileSize
new1.56 KB

another quick fix. everything should be all right now

/* filefield */
div.node-form div.vertical-tabs-panes div.description {
  overflow: auto;
  max-width: 650px;
  max-height: 80px;
  word-wrap: break-word;
}
div.node-form div.vertical-tabs-panes div.filefield-element div.description {
  overflow: auto;
  max-width: 550px;
  max-height: 80px;
  word-wrap: break-word;
}
div.node-form div.vertical-tabs-panes div.filefield-element fieldset.fieldset-additional-info div.description {
  overflow: scroll;
  max-width: 400px;
  max-height: 35px;
  word-wrap: break-word;
}
div.node-form div.vertical-tabs-panes div.filefield-element div.widget-edit {
  max-width: 470px;
}
/* filefield (admin module expanded) */
body.admin-expanded div.node-form div.vertical-tabs-panes div.description {
  overflow: auto;
  max-width: 500px;
  max-height: 80px;
  word-wrap: break-word;
}
body.admin-expanded div.node-form div.vertical-tabs-panes div.filefield-element div.description {
  overflow: auto;
  max-width: 400px;
  max-height: 80px;
  word-wrap: break-word;
}
body.admin-expanded div.node-form div.vertical-tabs-panes div.filefield-element fieldset.fieldset-additional-info div.description {
  overflow: scroll;
  max-width: 200px;
  max-height: 35px;
  word-wrap: break-word;
}
body.admin-expanded div.node-form div.vertical-tabs-panes div.filefield-element div.widget-edit {
  max-width: 260px;
}

I found the following fixed this issue for me:

.form-item .description
{
white-space: pre-line;
}

Category:feature» bug
Status:Patch (to be ported)» Needs review
Issue tags:+Novice
StatusFileSize
new269 bytes

Nice, @willhowlett. That's a very elegant solution. I don't see any negative repurcussions from it. Attached is a patch that adds it to style.css. Please review.

@LPCA: Just so you know, the correct status to for a patch is "needs review". See Status settings for an issue. :)

Category:bug» feature
Status:Needs review» Needs work

Oops. I forgot to test in IE8, and it doesn't quite get the job done there.

thanks! will test as soon as i get back to some old 6.x projects.

Status:Needs work» Fixed

I believe this is fixed in the latest dev. Can anyone confirm?

Automatically closed -- issue fixed for 2 weeks with no activity.