Rendering divs with styling e.g l{{}} to make the divs dynamic on a s12 colums


I don’t know why some cases fail , for example if i have div1 with l5 and div2 l5 it should fit in a row . But this fails, each of them appears in separate rows ,but this case works div1 l5 div2 l4 . Not sure why rendering behaves like that. Note : I am using materialize UI .