Avatar not centered in mobile profile view

VERIFIED FIXED

Status

Participation Infrastructure
Phonebook
VERIFIED FIXED
5 years ago
4 years ago

People

(Reporter: giorgos, Assigned: wbowling)

Tracking

2014-07.1
All
Android

Details

(Whiteboard: [kb=1426235] )

Attachments

(1 attachment)

(Reporter)

Description

5 years ago
On android / firefox the avatar is not centered in profile view.
(Reporter)

Updated

4 years ago
Summary: Avatar not centered in profile view → Avatar not centered in mobile profile view
Created attachment 8439514 [details]
The avatar is not centered

Attachment shows the avatar is not centered. If it was centered, the highest part of the avatar would be under the "n" of "Mozillian Profile", but instead it's under the "r". So it's about 10% or 15% more right than it should be.
Assignee: nobody → scott.leea
I played around with the CSS and it looks more centered now. Let me know what you think.

https://github.com/mozilla/mozillians/pull/972
(Assignee)

Comment 3

4 years ago
There are a lot of breakpoints in the CSS. The solution to centering something in CSS is to give it automatic side margins. If you keep adjusting a left-side offset as a percentage of the container's width when the size of the image is not defined also by a percentage then it will always be off-center.

I'm seeing if I can rewrite it.

Updated

4 years ago
Assignee: scott.leea → wbowling
Assigned to wbowling since he has a fix.
(Reporter)

Updated

4 years ago
Status: NEW → ASSIGNED

Updated

4 years ago
Status: ASSIGNED → RESOLVED
Last Resolved: 4 years ago
Resolution: --- → FIXED

Updated

4 years ago
Version: other → next
(Reporter)

Updated

4 years ago
Whiteboard: [kb=1426235]
QA verified on stage - profile image appears centered
- Android 4.4.4 Firefox for Android & Chrome
- iOS latest [iPod touch] Safari
- Firefox OS latest
Status: RESOLVED → VERIFIED
(Reporter)

Updated

4 years ago
Version: next → 2014-06.6
(Reporter)

Updated

4 years ago
Version: 2014-06.6 → 2014-07.1
You need to log in before you can comment on or make changes to this bug.