We are utilizing React Typescript with CSS. Some people in our company are using flex-direction: row
, even though thats the CSS default.
Is there any reason to have flex-direction: row
, otherwise our team will remove all code file lines using this. Just curious, if any cases we need to be sure? Are there any side effects or edge case scenarios?
CodePudding user response:
Not any issue, You can remove the because by default flex-direction is a row. So you can remove this. For more details view this link: https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction
CodePudding user response:
It wont create any issue as it is a default behavior of flex. However One question could be raised such as if we use media query in which we will declare the flex-direction to column for a specific screen size but after crossing that size the direction will be row again. In that case also if we don't declare the direction to row again, it will auto take its default behavior row. For clarification check the link below. try it out by removing the flex-direction from .flex-container class.
CodePudding user response:
If you check the first code sample, you’ll figure out that the child elements don’t stack by default within a flex wrapper. This is where flex-wrap comes into play:
nowrap (default): Prevents the items in a flex container from wrapping wrap: Wraps items as needed into multiple rows (or columns, depending on flex-direction) wrap-reverse: Just like wrap, but the number of rows (or columns) grows in the opposite direction as items are wrapped
.wrapper {
display: flex || inline-flex;
}
for more references you can check https://getbootstrap.com/docs/4.0/utilities/flex/