<DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>TITLE UNICOLOR</TITLE>
<STYLE>
*{padding:0; margin:0; list-style:none; text-decoration:none;
color:inherit;}
HEADER{width:100%; height:8%; border-bottom:1px solid #E0E0E0; border-
top:1px solid #E0E0E0; position:fixed;}
HEADER UL{display:table; margin:0 auto;}
HEADER LI{float:left; padding:30px; font-family:Verdana; font-
weight:600; font-size:14px;}
MAIN{width:50%; margin-left:5%; margin-right:5%;}
img.MAIN_IMAGES{max-width:100%;}
</STYLE>
</HEAD>
<BODY>
<HEADER>
<UL><LI><A href='#'>UPDATES</A></LI><LI><A href='#'>CATEGORIES</A></LI>
<LI><A href='#'>STUDIOS</A></LI><LI><A href='#'>MODELS</A></LI></UL>
</HEADER></A>
<MAIN>
<IMG src='1.jpg' class='MAIN_IMAGES'/>
<IMG src='2.jpg' class='MAIN_IMAGES'/>
<IMG src='3.jpg' class='MAIN_IMAGES'/>
<IMG src='4.jpg' class='MAIN_IMAGES'/>
<IMG src='5.jpg' class='MAIN_IMAGES'/>
<IMG src='6.jpg' class='MAIN_IMAGES'/>
<IMG src='7.jpg' class='MAIN_IMAGES'/>
<IMG src='8.jpg' class='MAIN_IMAGES'/>
<IMG src='9.jpg' class='MAIN_IMAGES'/>
</MAIN>
<ASIDE>
</ASIDE>
</BODY>
</HTML>
1 respuesta
Si lo que quieres es que las imágenes estén sobre el header puedes hacer algo como esto:
HEADER{
width:100%;
height:8%;
border-bottom:1px solid #E0E0E0;
border-top:1px solid #E0E0E0;
position:fixed;
background-color: #fff;
z-index: 1;
}
img.MAIN_IMAGES{
max-width:100%;
position: relative;
z-index: 10;
}
Adicional a lo que ya tenias agregué la propiedad z-index que permite cambiar el "orden de las capas" pero hay que tener en cuenta que esta propiedad se debe usar en compañía de la propiedad position con los valores relative, fixed o obsolute.