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
nested grids in forms #43
Comments
Hi, your structure is wrong. I made up a little Codepen to show you a nested grid with YAML-forms. |
I think this should be reopened for two reasons:
|
Hi, i just forked Jens Codepen because i think there are a few ym-gbox classes missing: 2nd form Correct nesting We need the ym-gbox classes for the outer grid (50%). At the moment i see two ways:
3rd form Idea from Github It's the same issue as mentioned for the 2nd form with the two options i described. If i add the class ym-gbox-right in line 105 it looks as expected. |
Update I suggest using my option 1. There could be some problems, if an element has the classes ym-grid and ym-gbox-left (or -right) together. The result is an element having padding, display:table and 100% width. This seems to be a creepy combination (with the old standard box model content-box). Alternative: border-box Use the border-box model and you can remove all the ym-gbox classes and their elements. Don't forget to set the grid padding by yourself if you choose this modern solution. Example: .ym-gl,
.ym-gr {
box-sizing: border-box;
*behavior: url(/scripts/boxsizing.htc); /* box sizing polyfill */
padding: 0 4px;
}
.ym-gl:first-child {
padding-left: 0;
}
.ym-gr {
padding-right: 0;
} |
I overhauled my Pen. It now lacks the example from this ticket, as we all agreed about the not correct code. I added a new third example which is based on the new box-model ( |
Hi Jens, why you reopened this issue? It's not a YAML issue. |
It was a request for the documentation. I marked it in this way and we will decide in the future, if there will be examples in the documentation or otherwise. |
Ok, that's a reason to have a separate repository only for documentation. Maybe later. ;-) |
An example of how to use nested grids in a form would be very useful. E.g. (if correct at all):
The text was updated successfully, but these errors were encountered: