cute-grids
cute-grids copied to clipboard
Problems when elements are different
Love cute grids, but I've encountered an issue when you mix and match elements for the grid. For example:
<div class="row">
<main class="cute-8-tablet">
<aside class="cute-4-tablet">
</div>
Perhaps instead of having the last-of-type be float right, they should all just float left?
Sorry for the late reply, Been really busy.
You are correct. There does seem to be issues when mixing elements like this though floating all left is not really the answer as it is still favourable to have the last column float right to make sure that the edge aligns due to browsers different rounding behaviours.
I think I have worked out the solution to this. Can you try the following and see if that works well for you: Replace the following in cutegrids.css:
[class*='cute-']:last-of-type { float: right; }
with the following:
[class*='cute-']:last-child:not(:first-child) { float: right; }
Let me know how that works for you.