Advertisement

How to manage multiple div in one line with horizontal scrollbar

I want to display 30 same div. So I am taking for loop with showing 30 div. Now I want div in only one line. If the div is out of screen then it will show horizontal scroll bar.

The code is:

<div id="sort-able" >
     <?php for($j=0;$j<30;$j++){?>
         <div class = "dragg-able" >Home - <?php echo $j;?></div> 
                    
      <?php } ?>
</div>

Advertisement

Answer

<div id="sort-able" style="width: 100%; overflow-x: scroll; white-space:nowrap;" >
     <?php for($j=0;$j<30;$j++){?>
         <div class = "dragg-able" style="display:inline; ">Home - <?php echo $j;?></div> 
      <?php } ?>
</div>

Example: http://kelostrada.pl/test.php

Advertisement