Flashcard cut off on mobile

  • Hi Dan,

    I’ve set up Qwizcards flashcards on my testing site, and for some reason when I use them on mobile, the flashcards get cut off by remaining the desktop size and starting from the left side but missing about the last 1/4 of the card on the right. I don’t know if there’s some kind of CSS I can apply, but I can’t seem to figure out why it’s doing this. Any help would be appreciated!

    The testing site is under restricted access right now, so let me know if you need to see the page itself.

    EDIT: So one more thing – I have many flashcard stacks on one page which are hidden by a content toggle. When the toggle is on (showing the stack), the first stack I open on the page goes to the proper mobile size. But if I then open another toggle, the stack is cut off. I don’t know if that helps any. But even when the stack is the proper size, the buttons below it still get cut off.

    Thanks,
    Mark

    • This topic was modified 2 years, 5 months ago by kthoven.
    • This topic was modified 2 years, 5 months ago by kthoven.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Dan Kirshner

    (@dan-kirshner)

    Normally each flashcard deck starts out cut off on a mobile device / small screen. If there’s an intro specified — with a “Start reviewing cards” button — when you click that button it should go to a “full-screen view” on your mobile device. Alternatively, you should see a “Full-screen view” icon at the top left of each flashcard deck. Clicking that should again take you to a responsive, screen-filling version of the deck on your mobile device.

    The content toggle may confuse things; I’d have to see an example (or, if you’re using a plugin for that, let me know which plugin). But I’m hoping the “Full-screen view” icon or adding an intro to each deck will do the trick!

    Thread Starter kthoven

    (@kthoven)

    Great, thank you for the very helpful and informative response. Just one follow up question: how do I get out of full-screen mode once I click the icon? I don’t see the icon when in full screen, so is it as simple as hitting the Back button on a phone, or the ESC on a desktop?

    Plugin Author Dan Kirshner

    (@dan-kirshner)

    Hmm, that’s odd. Once you’re in full-screen mode, the “back to page view” icon should be showing in the top-left corner. Alternatively, you should be able to swipe down from the top of the screen, or click the “pull-down tab” (three horizonal lines) at the top of the screen.

    Thread Starter kthoven

    (@kthoven)

    Ah, it was hiding behind my WordPress admin bar! Sorry about that. May I just reiterate that this is a fantastic plugin. So much care has gone into putting in really useful details. And the support you offer is quick, to the point, and always super respectful. Thanks, Dan!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Flashcard cut off on mobile’ is closed to new replies.