Block header and block body not aligned in mobile view
This happens when blocks drop down below the main content in mobile view.
Comments (7)
-
-
-
assigned issue to
-
assigned issue to
-
reporter Try this:
-
Go to my test site at http://тримаршрута.рф/ The domain name is in Cyrillic so you can also simply put xn--80aawqsdakgj7c.xn--p1ai in a browser address line.
-
Make the browser window narrower until it switches to mobile view and blocks move to the bottom of the page.
Then you should get the look as on my screenshots that you could study further.
-
-
Tested in 480x800 and 768x1024 using FF and no issues detected:
-
reporter If you mean that you cannot replicate it even on my test site then it's really weird.
I've studied the issue further and there are my findings:
- It's just partly related to the theme. The login block with the most remarkable misalignment has a max-width property which distorts the view, see a screenshot below.
If I 'kill' it then I get a more 'uniformed' misalignment visible on all blocks, read the next bullet about this.
- In mobile view a block header gets extra 10px margins, see the screenshot. As the block body still has no margins it appears wider and not aligned with its header. If I 'kill' this extra margin property then the layout gets nice and clean.
CONCLUSION
I guess I can improve it with custom CSS but would it be better to modify a core code accordingly?
-
reporter - changed status to closed
Doesn't appear after the latest updates have been implemented.
-
Linked to
#447 - Log in to comment
Can't replicate. I need more information.