css - More than one list item per line (based on resolution) -


I am working on a mobile app where there is a list of the elements displayed on the screen. Items are of a certain size, while a smartphone on the portrait can display only one item per line, I would like to display it on two lines on landscape mode, or on a tablet where it can fit 4 in a row ... screen KW / E shape as fit as possible in the same line.

I understand that I have to use the media query to do this ... I tried to use display: inline to do this To fit the entire width, set the items and overwrites the set width.

So the question is: How am I making a divisve I display it as configuring it and allowing screen size as many elements in a row?

Thanks in advance for responses!

Use -

  ul li {display: inline-block ; }  

Demo here -


Comments

Popular posts from this blog

sqlite3 - UPDATE a table from the SELECT of another one -

c# - Showing a SelectedItem's Property -

javascript - Render HTML after each iteration in loop -