css

Question 1

flex-basis

Answer 1

• it indicates the initial size of item before extra space is distributed.
• it is often used in place of width in flex layout
• you can specify the value of flex basis in px,%,rem, by default it has the value of auto
• flex-grow and flex-shrink are applied on top of flex-basis

Question 2

flex-flow

Answer 2

combination of flex-direction and flex-wrap

Question 3

how to configure css grid so as to allow children to take width as per their content

Answer 3

grid-template-columns: min-content min-content 1fr
https://www.youtube.com/watch?v=KtSl4xg_6cQ

Question 4

should we give padding to parents or margin to children

Answer 4

https://stackoverflow.com/questions/9917104/should-the-spacing-between-parent-and-child-containers-belong-to-parent-or-child
https://stackoverflow.com/questions/16880851/padding-on-parent-versus-margin-on-child

Question 5

css gap property

Answer 5

.parent_class_name{
gap: 30px;
}
The above CSS code will apply a gap/separation of 30px between children of the parent_class_name class.

Question 6

Flutter layout is very different from HTML layout

Answer 6

Constraints go down. Sizes go up. Positions are set by parents.
https://medium.com/flutter-community/flutter-the-advanced-layout-rule-even-beginners-must-know-edc9516d1a2

Question 7

why should we use mui typography

Answer 7

using typography we can standardise all varieties of text

Question 8

difference between inline-flex and display inline

Answer 8

https://stackoverflow.com/questions/72476024/difference-between-inline-flex-vs-inline