css relationships Elements live in relationship to each other parent -> child relationship : two-way. width on children = auto; area has to stay the same; less width -> more height typical parent set width margin-inline: auto -> margin left and right -> centers on screen. inheritence; ex font color is inherited by children. ==collapsing margins== -> child margin pushes down the parent (`display: flow-root;) -> padding -> sides together = collapsing margin, after padding !sides together cssdemystified.com -> deep-dive in CSS internals siblings normally stack flex, grid relationship more complex different sized siblings can make things look weird; use flex or grid to set their width. flex; children influence siblings and parent grid; more control over siblings. padding : flex pushes on sibling so sibling is smaller, grid cell stays same; sibling dont affect each other.