how can i “conect” the inputs with the grid:area propety in scss?
whith nth-of.type doesn´t work,
And i have to conect the first input OR the form to the grid-area?
if you can give me a little example with Sass syntaxis it would be awesome!.
Thanks in advance!.
im trying to do a calculator.
You need to specify a grid-area for each thing on the grid. Ex:
.button {
grid-area: btn;
}
main {
grid-template-areas:
"btn btn btn btn"
"btn btn btn btn"
...etc
thats what i do. Look at the second image.
look tha inputs in the first image, how can i connect this inputs to the grid area?
i try with this but doesn´t work with child or- child-of type
It’s never going to work because you’re using symbols that can’t be used as CSS identifiers. You would need to give each grid-area a valid name.
You also don’t need to use grid-template-areas
, you have 20 buttons all of exactly the same size in a 4*5 grid.
See example1 for a broken version using the unicode symbols as identifiers, example2 for a version that doesn’t attempt to use areas
Thanks for take time and whrite code and respond!. I was very confused, and it was easy thing.
1 Like