Material UI Element css not working, why?

Question

What could be going wrong for the css to not be working(The top bar - heading overlap)?

here is the component:

<FormControl fullWidth>
  {/* eslint-disable-next-line */}
  <InputLabel id="simple-select-label">GT Template</InputLabel>
  <Select labelId="simple-select-label" id="demo-simple-select-label" onChange={handleChange} value={gtTemplate}>
    <MenuItem value="employee/addemployeeimport">Add Employee Importer</MenuItem>
    <MenuItem value="lop-days">Employee LOP</MenuItem>
    <MenuItem value="lop-reversal">LOP Reversal Importer</MenuItem>
    <MenuItem value="employee/bankdetails">Employee Bank Details</MenuItem>
    <MenuItem value="loan-detail">Employee Loan Details</MenuItem>
    <MenuItem value="employee/employeecategory">Employee Category</MenuItem>
    <MenuItem value="resignation">Employee Resignation</MenuItem>

  </Select>
</FormControl>

ZomitaKa · Accepted Answer · 2022-04-22 13:11:36Z

2

You need to add label attribute to the Select element

<Select labelId="simple-select-label" id="demo-simple-select-label" onChange={handleChange} value={gtTemplate} label="GT Template">

And this may be usefull too https://mui.com/material-ui/react-select/

answered Apr 22, 2022 at 13:11

ZomitaKa

5454 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Vedant Shah Over a year ago

geez that was a stupid mistake on my part, thanks!

ZomitaKa Over a year ago

It's ok we all do such a thing, glad to help you :)

Collectives™ on Stack Overflow

Material UI Element css not working, why?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related