bxb11
New Member

Course Tiles Rendering on Mobile Bug?

My course tiles do not seem to render properly on mobile using the Student app. I'm on an Android, but the same happens on the iPhone.

Here is a screenshot of the course tile on my laptop:

336001_CoursseOnDashboardLaptop.png

Here it is via the Canvas Student app:

336017_CourseOnDashboardMobile.png

And finally, here it is when you enter the course via the Canvas Student app:

336018_CourseOpenInAppMobile.png

Is there something I should be doing here? All advice is appreciated in advance!

3 Replies
KristinL
Community Team
Community Team

Hi!

I am not able to recreate this, but it doesn't mean it's not an issue for others. Are your devices and apps up-to-date?

Just checked my apps and Android device. All are up to date.

I do see a slight difference in the mobile app and the web. It is suggested in the guides that "For best practice, images should be approximately 262 pixels wide by 146 pixels high" - 

https://community.canvaslms.com/docs/DOC-12780-4152626354

Even with that, just like you noticed, content is cut off because the ratio is a little different for mobile. I would suggest adding a 10 percent padding around all content so it doesn't touch the edges. This would be my quick fix. See the screenshots below.

Web: 

336433_pastedImage_1.png

iOS (Dashboard) 

336464_pastedImage_2.jpg

iOS (in course)

336465_pastedImage_3.jpg

Adding that little bit of padding keeps the content visible. Let me know if this helps.