How to prevent column break within an element?

Question

Consider the following HTML:

    

        
Number one
        
Number two
        &         


        
      

Answer 1

This works for me in 2015 :

li {
  -webkit-column-break-inside: avoid;
  /* Chrome, Safari, Opera */
  page-break-inside: avoid;
  /* Firefox */
  break-inside: avoid;
  /* IE 10+ */
}
.x {
  -moz-column-count: 3;
  column-count: 3;
  width: 30em;
}

  

    
Number one
    
Number two
    
Number three
    
Number four is a bit longer
    
Number five