css display property: make visible without setting the actual display type?

sir-haver 0
Viewed 34

I have a component which is wrapped in a div with display: flex

Another component controls whether that other component is visible or not. The initial state is display: 'none' and on a certain condition it will be shown. I wouldn't want to show it again by setting it to display flex, because I prefer that the component itself will be responsible for that. I would like to do something like "unset the display: none and let the component decide how it will be shown".

const AddNewRowHoverArea = styled('div')({
  height: 16,
  cursor: 'pointer',
  display: 'flex',
  justifyContent: 'flex-end',
  '& > div': {
    display: 'none',
  },
  '&:hover div': {
    display: 'flex',
  },
});

Currently it's done with display: flex. In such case is my only option is to use visibility: hidden ?

reactjs javascript css
2 Answers

If I understood you question correctly ,You can undone display none like this:

$('#ur_element_id').css('display','block');
Saad Rehman0

you can do this like display: initial or display: block

Abasaheb Gaware0
Related