Salve,
Sto cercando di mettere due div allineati orrizontalmente all'interno di un altro. Il tutto poi deve essere centrato sullo schermo a ogni risoluzione e su questo anche vorrei un aiuto. Grazie e di seguito il codice:
Sto cercando di mettere due div allineati orrizontalmente all'interno di un altro. Il tutto poi deve essere centrato sullo schermo a ogni risoluzione e su questo anche vorrei un aiuto. Grazie e di seguito il codice:
HTML:
<!doc html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>Welcome</title>
<link rel="stylesheet" href="../css/entrypg.css">
<!-- CSS FINISH -->
</head>
<body>
<div class="main-container">
<div class="child">
<a href=""><img src="" alt="child"></a>
</div>
<div class="parent">
<a href="experimentarium.html"><img src="" alt="parent"></a>
</div>
</div>
</body>
</html>
Codice:
body{
margin: 0 auto;
padding:0;
}
.main-container {
margin: 0 auto;
width: 80%;
height: 80%;
overflow: hidden;
border: 2px black solid;
margin-top: 5%;
}
.child {
clear: both;
position: absolute;
float: left;
border: 2px yellow solid;
width: 48%;
height:auto;
}
.parent {
position: absolute;
float: left;
border: 2px red solid;
width: 48%;
height: auto;
top:0;
}
/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
}