Widget column height issues on the profile page

[Flexx]

There seems to be some kinda overflow or something when you add widgets to your profile (this seems to happen in the profile only), At first if you add the widgets you wont notice, but if you reload the page and scroll to the bottom of the page you see a big space below.

Steps to reproduce:

1) Remove all widgets and reload page.

2) Add all widgets and reload page (the more widgets you add is the more space you get)

3) Scroll to the bottom

[Flexx]

I find the error, Seems to be in this piece of code:

/

• Make all elements have the same min-height *
• This addresses the issue of trying to drag a widget into a column that does
• not have any widgets. *
• @param {String} selector
• @return void */

elgg.ui.widgets.equalHeight = function(selector) {

var minHeight = 0;
$(selector).each(function() {

if ($(this).height() > minHeight) {

minHeight = $(this).height();

}

})
$(selector).css('min-height', minHeight);

};

When i remove it. Everything works ok. Not sure if something is missing in it or what cuz im not any good at js.

[Flexx]

Replying to Flexx:

I find the error, Seems to be in this piece of code:

/

• Make all elements have the same min-height *
• This addresses the issue of trying to drag a widget into a column that does
• not have any widgets. *
• @param {String} selector
• @return void */

elgg.ui.widgets.equalHeight = function(selector) {

var minHeight = 0;
$(selector).each(function() {

if ($(this).height() > minHeight) {

minHeight = $(this).height();

}

})
$(selector).css('min-height', minHeight);

};

When i remove it. Everything works ok. Not sure if something is missing in it or what cuz im not any good at js.

Change the var maxHeight = 0; to var maxHeight = height + 'px';

[cash]

Did you mean to close this ticket? Closed tickets do not show up on our list of things to fix.

Also, can you upload a image that shows the issue and mention what browsers you see it in?

[Flexx]

Ok my bad, Im new t this thing :) here are the images:

I zoomed the page out so you can see the whole site.

I had change this code: var maxHeight = 0; to var maxHeight = height + 'px'; to get the page right. The first image is with the default code

This one is with the fix:

[cash]

Thanks for the images. I'll take a look at the JavaScript for this when I have time.

[Flexx]

No problem.

[Flexx]

Just to notify that evan fixed this @ ​https://github.com/Geminixx/Elgg/commit/ebf92159e4e44014c0090e3bf1ed01184571ec8b#commitcomment-792979

[cash]

Refs #4192 adds proper 'px' to minHeight but does not solve the issue

Changeset: 5ee43086ec79b38e3f2cdb288f80bd5f24d413b1

[cash]

The problem is tied to the approach rather than being a simple typo

[Cash Costello]

Fixes #4192 making the bottom of widget columns equal rather than height

Changeset: 855de1b33e1ba1753ac1a5088e640e5fcff09f79

[Cash Costello]

Fixes #4192 making the bottom of widget columns equal rather than height

Changeset: 855de1b33e1ba1753ac1a5088e640e5fcff09f79