What can I do in order for the dark green div (Inner3) to be right after (under) the blue and pink divs (Inner1 and Inner2 respectively)?. Currently there is some kind of "space".
Note: I put the orange div on purpose after them and only then the green one, the formation does matter (I'm trying to learn how to change css when changing resolutions on media query).
.OuterDiv {
width: 100%;
overflow: hidden;
padding: 0px;
margin: 0px;
background-color: #E3EAD7;
height: 100%;
}
.Inner1 {
width: 30%;
background-color: #6D97C0;
padding: 0px;
margin: 0px;
overflow: hidden;
height: 200px;
float: left;
}
.Inner2 {
width: 30%;
background-color: #ECB7D8;
padding: 0px;
margin: 0px;
overflow: hidden;
height: 200px;
float: left;
}
.Inner3 {
width: 300px;
background-color: #F5E6AD;
padding: 0px;
margin: 0px;
overflow: hidden;
height: 300px;
}
.Inner4 {
width: 60%;
background-color: #728666;
padding: 0px;
margin: 0px;
overflow: hidden;
height: 200px;
float: left;
}
<body>
<div class="OuterDiv">
<div class="Inner1"></div>
<div class="Inner2"></div>
<div class="Inner3"></div>
<div class="Inner4"></div>
</div>
</body>
Aucun commentaire:
Enregistrer un commentaire