• By default, LeadsHook Decision trees display one column wide on mobile.
  • If it has many questions, there will be a lot of vertical space.
  • This means a lot of scrolling for your users.


  • We can override this layout using custom CSS


  • First just create a new decision tree level script
  • And then copy paste the following code, to create a two column layout.
@media screen and (max-width: 1024px) {
  	 margin: auto;
        float: left !important;
        width: 130px !important;
    .question-answer.selected .panel.panel-default.panel-answer, .question-answer.selected:hover .panel.panel-default.panel-answer{
    	width: 100px !important;
    	font-size: 16px !important;
  .row:after, .row:before{
  	display: inline !important;

Video instructions:

Leave a Reply

Your email address will not be published. Required fields are marked *