Is it feasible to achieve the following using only HTML and CSS?
The condition is that since the divs are automatically generated in a list, they should not be nested within another HTML element (such as adding a div for each line is restricted):
Here is an example of how the HTML is structured:
<div class="s"></div>
<div class="s"></div>
<div class="big_s"></div>
<div class="s"></div>
<div class="s"></div>
<div class="s"></div>
<div class="s"></div>
<div class="s"></div>
<div class="big_s"></div>
<div class="s"></div>
<div class="s"></div>
<div class="s"></div>
<div class="s"></div>
<div class="s"></div>
This structure resembles a list.
I have been unsuccessful in my attempts to implement this so far. It seems that utilizing float:left and clear:both or display:inline-block is not solving the issue.
If anyone has any suggestions on how to accomplish this, I would greatly appreciate it!
Thank you.