Не могу элементарно разобраться с версткой на React. Есть голубой div, вложенный в серый div. Для внутреннего div задаю marginTop и marginLeft 10px, но margin top появляется у внешнего div, почему?
Вот как это выглядит:
Вот код:
import React from "react"
function App(){
return(
<div style={{
backgroundColor: "grey",
height: "150px",
width: "150px"
}}>
<div
style={{
width: "100px",
height: "100px",
marginTop: "10px",
marginLeft: "10px",
backgroundColor: "#7fadc9"
}}>
</div>
</div>
);
}
export default App;
P.s.: подобное тоже проявляется, когда вместо голубого div стоит какой-нибудь h1 без стилей, в таком случае внешний серый div съезжает вниз ровно на высоту элемента h1