Я новичок в CSS
, и у меня есть несколько элементов, показанных ниже. Когда я zoom in/out
страница, я обнаружил, что элементы перекрываются друг с другом. По сути, у меня есть 2 div для хранения Button/ Input Field
и 2 div для хранения table
. Как я могу предотвратить это с помощью CSS
?
DOM:
<div id='itemBar1' style={{verticalAlign: 'baseline', position:'static', zIndex:"999", height:"5%"}} >
<div style={{padding:"5px 5px 5px 10px", float: "left"}} >
<Button>
</div>
</div>
<div id="table1" style={{verticalAlign: 'baseline', height:"50%", position:'static'}}>
<Table Component>
</div>
<div id='itemBar2' style={{verticalAlign: 'baseline', position:'static', height:"5%"}}>
</div>
<div id="table2" style={{verticalAlign: 'baseline', height:"40%", position:'static'}}>
<Table Component>
</div>