How to Arrange Learndash Quiz Horizontally

  • The LearnDash course plugin has various types of quiz creation facility . One of the most common type is Multiple Choice Question which provides four or five answer options . The default design of the quiz is that the quiz options are arranged vertically . How to Arrange Learndash Quiz Horizontally

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Dave Warfel

    (@davewarfel)

    I’m actually launching a new plugin soon that provides this option, along with a ton of other features just related to LearnDash quizzes.

    But you can use this code to arrange the answers horizontally.

    For multiple choice questions, this will work on all screens larger than 600px.

    @media (min-width:600px) {
    .learndash .wpProQuiz_content .wpProQuiz_questionList[data-type="multiple"] {
        display: flex;
        flex-wrap: wrap;
    }
    .learndash .wpProQuiz_content .wpProQuiz_questionList[data-type="multiple"] .wpProQuiz_questionListItem {
        margin: 0 0.5em 0.5em 0;
    }
    .learndash .wpProQuiz_content .wpProQuiz_questionList[data-type="multiple"] label {
        padding: 0.4375em 0.75em;
}
    Thread Starter Nguy?n Qu?c Hùng

    (@ranbac)

    Can you show me how to use that code?

    Plugin Author Dave Warfel

    (@davewarfel)

    1. Go to Appearance > Customize
    2. Click on “Additional CSS”
    3. Copy the code above
    4. Paste it into the box
    5. Click “Publish” at the top
    Thread Starter Nguy?n Qu?c Hùng

    (@ranbac)

    Great! you are pro!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How to Arrange Learndash Quiz Horizontally’ is closed to new replies.