Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problems when elements are different #2

Open
AliciaRamirez opened this issue Feb 3, 2016 · 1 comment
Open

Problems when elements are different #2

AliciaRamirez opened this issue Feb 3, 2016 · 1 comment

Comments

@AliciaRamirez
Copy link

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?

@dazzyweb
Copy link
Owner

dazzyweb commented Apr 6, 2016

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants