Have an idea?

Visit Sawtooth Software Feedback to share your ideas on how we can improve our products.

Increasing conjoint task width causes weird format of mobile view

Hello,

We try to adjust the conjoint task width, for example to 850 pixels. After the change, the mobile format of the conjoint looks very weird.

Before adjusting the task width, the mobile format looks good and each task takes up the whole screen. But after adjusting the task width to 850 pixels, each task on mobile exceeds the screen.

Is there a way to only increase the task width for PC without changing the format of the mobile view?

Appreciate any suggestions! Thanks!
asked Jun 21 by Yolanda-Wong (440 points)

1 Answer

+1 vote
 
Best answer
CSS supports defining rules with minimum or maximum screen widths, so we can use that to style the page in ways only for desktop users.  Lighthouse usually uses 800px as the cutoff screen width, so try adding this to your exercise:

<style>
@media only screen and (min-width: 800px) {
    #[% QuestionName() %]_div {
        width: 90%;
    }
}
</style>


In that example, I set the width to 90% of the screen, but line 4 can be replaced with any CSS rules you want.
answered Jun 21 by Zachary Platinum Sawtooth Software, Inc. (206,100 points)
selected Jun 21 by Yolanda-Wong
Thank you so much! It works!!!
...