How to set CSS for the progress bar

  • Resolved mathiaspriebe

    (@mathiaspriebe)


    5 years, 9 months ago

    Hello,
    the progress wrapper and the progress bar are set to a large max-width (.fw-progress-wrap: 1800px). Somehow this leads to over scale our container’s width and unfortunately breaks the whole layout of our Generate Press theme in mobile. It renders a white space to the right depending on actual screen and – at least on iPad (Safari and Chrome) – aligns the other content outside of the box to the left.

    I’ve been playing around with max-widths like 70% which works fine on PC but is not feasible for mobiles.

    Could you please suggest a line of CSS to prevent this or fix the issue if this was the case for other themes too?

    Thank you in advance.

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author mondula2016

    (@mondula2016)

    Hey.
    Thx for the call again, we will come back with a piece of CSS shortly.

    best regards

    M ondula Team

    Thread Starter mathiaspriebe

    (@mathiaspriebe)

    It took me a while, but for now this CSS does the trick:

    @media all and (min-width:769px) {
    #multi-step-form.fw-large-container .fw-progress-bar-container {
    width: 100% !important;
    }
    }

    Since I do not know all implications, any better hint is welcome.

    Plugin Author mondula2016

    (@mondula2016)

    top.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to set CSS for the progress bar’ is closed to new replies.

Tags