Buenas amigos. Aun soy algo novato con esto de CSS y en mi práctica de hoy me tope con algo que no se como resolverlo, no se si correctamente...
Estoy haciendo la estructura básica con las nuevas etiquetas de HTML5 y con CSS trato de acomodarlos correctamente, como en esta imagen:
En mi caso tengo el article algo mas grande y el aside pequeño, el problema que tengo es cuando el
aside quiero ponerlo a la derecha del
article. Al article lo pongo como un elemento flotante hacia la izquierda y el aside flotante a la derecha, el problema aqui es que el aside esta siempre algo mas abajo que el article, así:
para que estuvieran ambos al mismo nivel use margenes negativos pero no se si sea correcto hacer eso o si simplemente lo estoy haciendo mal, aquí esta mi codigo:
Código HTML:
<div id="contenedor">
<article>
<section>
<h3>Siempre es bueno...</h3>
<br>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</section>
</article>
<br>
<br>
<aside class="bloque-derecha">
<div class="titulo">
<h3>Publicidad</h3>
</div>
<section>
<!--Aqui iran imagenes de publicidad-->
</section>
</aside>
</div>
Código:
#contenedor{
/*background: #fba456;*/
margin-top: 20px;
overflow: hidden;
}
article{
background: white;
float: left;
min-height: 500px;
padding: 20px;
text-align: justify;
width: 70%;
}
.bloque-derecha{
background: white;
margin-top: -40px;
float: right;
width: 290px;
}
.bloque-derecha .titulo{
background: #1d1d1d;
color: white;
height: 50px;
line-height: 50px;
text-align: center;
width: 100%;
}
.bloque-derecha section{
background: url('../img/anuncio.jpg') no-repeat;
height: 250px;
width: 100%;
}
les agradeciera que me ayudaran con esto, no me siento agusto avanzar si tener claro esto hehe
