Buenas tengo dos problemas el primero radica en q tengo una img y las dimensiones de ella son inmensas quiero ponarla como img de arriba aki el codigo cm lo tengo
Código HTML:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<div class="center_div" >
<div class="header">
<div class="banner"><img src="img/venbanner.jpg" /></div>
</div>
</div>
<div class="b-content">
<div class="b-menu">
CONTIDO 1 PARA EL MENU
</div>
<div id="b-a">
CONTENIDO 2
</div>
</div>
</div>
</body>
</html> mi css lo tengo
.center_div{
background:#FFF;
color:#000;
width: 80%;
margin:0 auto;
border-radius: 15px;
border:1px solid black;
}
.header{
width: 100%;
height: auto;
}
.banner img{
width:100%;
height: 40%;
padding:5%;
box-sizing:border-box;
display: block;
margin-left: auto;
margin-right: auto;
border:none;
}
bien ahora no se como hacer para q esa img tome undas medidas proporcionales al tamaño de la pantalla pq se q si lo coloco en pixels esta listo la pongo en las dimensioes q desee sin embargo me gustaria hacer algo mas responsive me darian alguna alternativa??
el segundo punto es q en ese mismo codigo html hay dos div de contenido 1 y 2 ambos los kiero poner uno al lado de otro sin embargo aparecen debajo buscando en internet lei q la propiedad float me ayudaria a posicionarlo en efecto lo hiso pero ests div salen del contendor mas grandde es decir quedan por afuera... no encuentro como hacer q kede uno al lado del otro y dentro del contenedor, muchas gracias y espero sus comentarios sean productivos