[ZBX-5353] Username and password fields may be missaligned on login form Created: 2012 Jul 23  Updated: 2017 May 30  Resolved: 2012 Aug 06

Status: Closed
Project: ZABBIX BUGS AND ISSUES
Component/s: Frontend (F)
Affects Version/s: 2.1.0
Fix Version/s: 2.0.3rc1, 2.1.0

Type: Incident report Priority: Trivial
Reporter: Andrey Bondarenko Assignee: Unassigned
Resolution: Fixed Votes: 1
Labels: usability
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified
Environment:

Mozilla Firefox for Ubuntu 14.0.1


Attachments: PNG File login-2.0.1.png     File login-form-1.patch     File login-form.patch    
Issue Links:
Duplicate
is duplicated by ZBX-5375 Login form css broken Closed

 Description   

Username and password fields on login form may go under prompt labels (see screenshot).

In my oppinion, the cause for the issue is usage of absolute and relative units within single form. As result form becomes sensitive to user fornt selection. Out of three browsers on my host (Google Chrome, Rekonq, Mozilla Firefox) I can reproduce issue only in Firefox.

login-form.patch fixes the issue for me.



 Comments   
Comment by richlv [ 2012 Jul 23 ]

similar problem will happen with translations, which is issue ZBX-5057

Comment by Andrey Bondarenko [ 2012 Jul 25 ]

Probably better solution, that uses white-space: nowrap style to avoid fields wrapping. Behaves better on zoom change. Tested with Firefox, Chrome, Rekonq.

Comment by Pavels Jelisejevs (Inactive) [ 2012 Aug 02 ]

Andrey,

Thank you for you patches. The first one worked like a charm.

RESOLVED in svn://svn.zabbix.com/branches/dev/ZBX-5353.

Comment by Andrey Bondarenko [ 2012 Aug 03 ]

Hi, Pavels. I suggest you check the second patch (login-form-1.patch). The first one had issues when zooming page. That's why I'm uploaded the second one. It works in all zooms i've tried.

Comment by Andrey Bondarenko [ 2012 Aug 03 ]

Sorry, for inconvinience, but I think current resolution is not ideal. Personally I prefer login-form-1.patch, but it may need CSS expert review.

Comment by Pavels Jelisejevs (Inactive) [ 2012 Aug 03 ]

I've tried both patches and I din't notice any difference when zooming. They both work fine. What problems did you have exactly?

Comment by Andrey Bondarenko [ 2012 Aug 06 ]

On my machine (Kubuntu 12.04, KDE desktop, oxygen style, fonts 9pt and 10pt, screen resolution 96dpi) username and password fields sometimes gets wrapped if I increase zoom level (Firefox and Rekonq only). I suppose it is because custom fonts setup, I use slightly larger fonts than defaults. In first patch I use absolute units for all objects, but it seems some padding or margins are inherited from outer containers with relative sizes. This sometimes leads to fields wrapping. In the second patch I'm using explicit "white-space: nowrap" style which, in my opinion, should prevent form wrapping always.

Comment by Pavels Jelisejevs (Inactive) [ 2012 Aug 06 ]

OK, probably the word-wrap approach is a better choice.

RESOLVED.

Comment by Toms (Inactive) [ 2012 Aug 16 ]

TESTED

Comment by Pavels Jelisejevs (Inactive) [ 2012 Aug 16 ]

Fixed in 2.0.3rc1 r29603 and 2.1.0 r29604.

CLOSED.

Generated at Wed Apr 24 12:18:29 EEST 2024 using Jira 9.12.4#9120004-sha1:625303b708afdb767e17cb2838290c41888e9ff0.