zoom normal
le pongo zoom y estos espacios no se agrandan
pero estos si son los que se agrandan
les dejo los codigos:
Código HTML :
<!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8"> <title>Index</title> <link rel="stylesheet" type="text/css" href="estilos.css"> </head> <body> <div id="contenedor"> <header> </header> <nav></nav> <section id="articulos"> <article id="poesia1"> <article id="imagen1"></article> <article id="lec1"></article> </article> <article id="poesia2"> <article id="imagen2"></article> <article id="lec2"></article> </article> </section> <section id="autor"></section> <footer> <address></address> </footer> </div> </body> </html>
Código CSS :
*{
box-sizing:border-box;
}
body{
margin: 0;
padding:0;
}
#contenedor{
margin: 0 auto;
padding: 0;
background: #F0FF00;
width:73.5294117647%;
max-width:1000px;
}
header{
margin:0 auto;
background: #A5B000;
width: 95%;
height: 200px;
}
nav{
background:#018207;
width:95%;
height:100px;
margin:0 auto;
}
#articulos{
background:#00FFD4;
width:60%;
height: 500px;
margin:1% 0% 1% 2.5%;
float:left;
}
#poesia1{
background: #FF00F3;
width:100%;
height:250px;
}
#imagen1{
background: #0027FF;
width: 39%;
height: 95%;
margin: 1% 1% 0.5% 1%;
float:left;
}
#lec1{
background: #0027FF;
width: 57%;
height: 95%;
margin: 1% 1% 0.5% 1%;
float:left;
}
#poesia2{
background: #FF00F3;
width:100%;
height:250px;
}
#imagen2{
background: #0027FF;
width: 39%;
height: 95%;
margin: 0.5% 1% 1% 1%;
float:left;
}
#lec2{
background: #0027FF;
width: 57%;
height: 95%;
margin: 0.5% 1% 1% 1%;
float:left;
}
#autor{
background:#0027FF;
width:35%;
height:500px;
margin:1% 1% 1% 0;
float:left;
}
footer{
background:#FF0000;
width: 95%;
height:100px;
margin:0 auto;
clear:both;
} 
