Me gustaria q me dieran un tip de como poder lograr posicionar el div#cp q es el cuadro negro al lado del div#sidebar1 q es el q contiene el arte al lado izquierdo
Aqui les dejo el link de la web: http://urbanconnexion.net/Home.html
Aqui esta el codigo css
Código:
@charset "utf-8";
body {background-color: #FFF;
}
#contenedor{
float:left;
width: 100%;
height:auto;
position: absolute;
min-width:1333px;
}
#ab { background-image:url(http://urbanconnexion.net/menulinea1.png);
width: 100%;
height: 40px;
margin-bottom: 5px;
}
/*Estilo para el banner superior*/
#banner_caja1 { width: auto;
height: auto;
}
#banner_1 { float:left;
width: 820px;
height: 120px;
margin-right: 10px;
}
#radio { float:left;
width: 500px;
height: 120px;
border-width:thin;
border-style:dotted;
}
/*Finaliza Estilo para el banner superior*/
#clear{clear:both;}
/*Comienza el menu*/
#navi{border-width:thin;
border-bottom-style:dotted;
width: 100%;
height: auto;
padding-left:200px;
float:left;
list-style: none;
}
#navi li{ float:left;
}
#navi li a{display:block;
font-size:20x;
color:#000;
padding-left: 110px;
}
#navi li:hover > a{color: #CCC;}
/* termina el menu*/
/* div para un elemento flash */
#cajaflash{float:left;
width:100%;
height:auto;
margin: 0 0 0 0;
border-bottom-width:thin;
border-bottom-style:dotted;
}
#naviflash { clear:left;
width: 900px;
height: 200px;
margin: 0 auto 0 auto;
background-color:#666;
}
/* div del contenido principal*/
#sidebar1{width: 200px;
height:auto;
float:left;
position:absolute;
margin-left:50px;
border-width:thin;
border-style:dotted;
}
#promo_L1{width: 150px;
height: 500px;
background-color:#666;
border-width:thin;
border-style:dotted;
border-color:#000;
margin-bottom: 15px;
margin-left:25px;
}
#promo_L2{width: 150px;
height: 200px;
background-color: #FFF;
border-width:thin;
border-style:dotted;
border-color:#000;
margin-bottom: 15px;
margin-left:25px;
}
#promo_L3{width: 150px;
height: 100px;
background-color: #FFF;
border-width:thin;
border-style:dotted;
border-color:#000;
margin-bottom: 15px;
margin-left:25px;
}
#cp{ float:left;
background-color:#000;
width:100%;
height: 2000px;
position: static;
}
Aqui el html
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Urbanconnexion.net</title>
<link href="Home.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="contenedor">
<!-- el div que contiene la linea de arriba antes del banner ce urbanconnexion -->
<div id="ab">
</div>
<!-- div del banner-->
<div id="banner_caja1">
<div id="banner_1">
<img src="http://urbanconnexion.net/baner2s.png" width="820" height="120" />
</div>
<div id="radio">
Aqui va un radio o mp3 player
</div>
</div> <!-- termina banner caja1-->
<div id="clear"></div>
<!-- div del menu-->
<ul id="navi">
<li><a href="#">Home</a></li>
<li><a href="#">Musica</a></li>
<li><a href="#">Fotos</a></li>
<li><a href="#">Foro</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Eventos</a></li>
</ul> <!-- termina el menu-->
<div id="clear"></div>
<!-- empieza el div del flas de promociones superior-->
<div id="cajaflash">
<div id="naviflash">Aqui va otro elemto flash
</div>
</div> <!-- termina el div del flash de promo-->
<div id="clear"></div>
<div id="sidebar1">
<div id="promo_L1"><img src="http://urbanconnexion.net/nyjory.jpg" width="149" height="500" /> </div>
<div id="promo_L3"></div>
<div id="promo_L1"> </div>
<div id="promo_L2"> </div>
<div id="promo_L1"> </div>
</div>
<div id="cp"></div>
</div>
<!-- cierra contenedor-->
</body>
</html>
Espero que puedan decirme que estoy haciendo mal... Grax de ante mano