More than one list item per line (based on resolution)
Pergunta
I'm working on a mobile app where there's a list of elements displayed on the screen. The items are of a certain size. While a smartphone on portrait can only display one item per line, I'd like to have it displaying two per line on landscape mode, or on a tablet where it can fit 4 in a line... W/e size the screen is fit as many as possible in the same line.
I understand I need to use media querys to get it done... I tried using display:inline
to get it done but it overwrote the set width I created and stretched the items to fit the whole screen.
So the question is: how do I make a div stay the size I configure it and display as many elements in one line as allowed by the screen size?
Thanks for the responses in advance!
Solução
Outras dicas
Perhaps this is better off as a comment - but it looks like you are not using the display property as intended - to maintain width you can use:
display:inline-block;
or
float:left;