Foros del Web » Creando para Internet » CSS »

Como posicionar este div??

Estas en el tema de Como posicionar este div?? en el foro de CSS en Foros del Web. Que tal gente como va???. Bueno persento mi problema... Estoy armando una pagina, en la cual quiero usar border redondeado, encontre en una web una ...
  #1 (permalink)  
Antiguo 05/02/2008, 19:43
Avatar de diegoy2k  
Fecha de Ingreso: julio-2006
Ubicación: Algun Lugar
Mensajes: 68
Antigüedad: 11 años, 5 meses
Puntos: 0
Como posicionar este div??

Que tal gente como va???.
Bueno persento mi problema...
Estoy armando una pagina, en la cual quiero usar border redondeado, encontre en una web una manera de hacerlo, tome el codigo y lo adapte... [Son mis primeros bordes redondeado, pero los creditos van para su creador original.], la cuestion es que cuendo comienzo a querer insertar mas div dentro de los div que contienen las imagenes de los bordes, las cosa no sale como yo quiero!!!, a continuacion muestro una imgen de lo que me queda, e indico donde quiero que valla el div en rojo!!!, mas abajo dejo el codigo, e leido, probado pero algo esta mal, no puedo poner el div donde yo quiero, sin que se me desarme todo!!!
Espero me ayuden desde ya muchas gracias.





El Codigo!!! [Perdon, si hay cosas mal hechas!!!]...

Código HTML:
<html>
<head>
	<title>Arara'a Yagua</title>
	<style type="text/css" media="screen">
		*{
			border:									0px;
			padding:								0px;
			outline:								0px;
			font-family: 						Verdana, Arial, Helvetica, sans-serif;
			font-size: 							15px;
			margin-top: 						0px;
			margin-right: 					0px;
			margin-bottom: 					0px;
			margin-left: 						0px;
			line-height: 						25px;
		}
		body{
			background-image: 			url(bosque.jpg);
			background-position: 		0% 0%;
			background-repeat: 			repeat-x;
			background-attachment: 	scroll;
			background-color: 			#882f05;
		}
		div.top {
			/* La altura es de 28 píxeles ya que ese es el espacio que ocupa nuestra imagen de esquina. */ 
			height:									28px; 
			background-image:				url(top_line.gif); 
			background-repeat: 			repeat-x;
			border:									0px solid #00AA00;
			padding:								0px 0px 0px 0px;

		}
		
		img.esquina_sup_izq{
			float:									left;
		}
		img.esquina_sup_der{
			float:									right;
		}
	
		#contenedor{
			position:						relative;
			top:								25px;
			text-align: 				center;
			width:							861px;
			background-color:		#FFFFFF;
			margin:							auto;
			padding:						0px 0px 0px 0px;
			opacity: 						0.9;
			-moz-opacity: 			0.9;
			filter: 						alpha(opacity=90);
		}

		div.content {
		  background-image:			url(left_line.gif);
      background-repeat:			repeat-y;
		}
		div.boxcontrol {
      padding-left:						30px; 
      background-image:				url(right_line.gif); 
      background-position:		right; 
      background-repeat:			repeat-y;
		}

		#contenedor #cabecera{
			position:								reletive;
			width:									800px;
			height:									150px;
			border-bottom:					0px solid #CCFFCC;
			background-image: 			url(bannersuperior.jpg);
		}
		#info{
		background-image: 			  url(f_tv.gif);
		width:										800px;
		text-align:								right;
		}
		#contenedorinterno{
		position:									relative;
		width:										800px;
		background-color					#000099;
		border:										1px solid #00AA00;
		}
		
		#contenedorinterno #menu{
			position:							inherit;
			width:								177px;
			text-align:						center;
			background-color:			#000000;
			opacity: 							0.8;
			-moz-opacity: 				0.8;
			filter: 							alpha(opacity=80);
			border:										1px solid #FF0000;
		}
		#menu #lista{
		margin-left:						17px; 					/*aca doy, margenen*/ 
		}
		
		#menulateral a{
			display:							block; 				/*Muestro un bloque al elemento de la lista*/ 
			height:								28px;
			background-color:			#555555; 			/*algo de color al fondo*/ 
			color:								#FFFFFF; 			/*Color para el texto*/ 
			width:								160px; 				/*defino el ancho del rectangulo del vinculo*/
			text-decoration				:none; 				/*elimino el subrayado del vínculo*/ 
			font-weight						:bold; 				
			list-style-image: 		url(vineta_roja.jpg); 
		}

		#menulateral a:hover {
			background-color:			#A7D772;			/*decoración para el evento hover (mouse encima)*/
			color:								#000000;
			text-transform:				uppercase; 		/*decorare los vinculos en mayusculas*/
			text-align:						center; 
		}
		#contenedorinterno #datos{
			width:								150px;
			text-align:						center;
			background-color:			#FF0000;
			opacity: 							0.8;
			-moz-opacity: 				0.8;
			filter: 							alpha(opacity=80);
		}
		div.bottom {
      height:28px; 
      background-image:url(btm_line.gif); 
      background-repeat: repeat-x;
		}
		img.esquina_inf_izq { float:left; }
		img.esquina_inf_der { float:right; }
		
	</style>
	<!--- Probendo AJAX -->
	<script type="text/javascript" language="javascript">
		var READY_STATE_UNINITIALIZED=0;
		var READY_STATE_LOADING=1;
		var READY_STATE_LOADED=2;
		var READY_STATE_INTERACTIVE=3;
		var READY_STATE_COMPLETE=4;
		var peticion_http;
		function cargaContenido(url, metodo, funcion) {
				peticion_http = inicializa_xhr();
				if(peticion_http) {
					peticion_http.onreadystatechange = funcion;
					peticion_http.open(metodo, url, true);
					peticion_http.send(null);
				}
		}
		function inicializa_xhr() {
					if (window.XMLHttpRequest) { // Mozilla, Safari, ...
						return new XMLHttpRequest();
					}
			else if (window.ActiveXObject) { // IE
				return new ActiveXObject("Microsoft.XMLHTTP");
			}
		}
				
		function muestraMensaje() {
			if(peticion_http.readyState == READY_STATE_COMPLETE) {
					if (peticion_http.status == 200) {
						//alert(peticion_http.responseText);
						var capa=document.getElementById("prueba");
						var contenido='';
						contenido +='<p>Esto se modifico via ajax???</p>';
						contenido +=peticion_http.responseText;
						alert(contenido);
						//capa.innerHTML=contenido;
					}
			}
		}
		
		function muestraContenidosa() {
			cargaContenido("http://localhost/ajax/holamundo.txt", "GET", muestraMensaje);
		}
		function muestraContenidosb() {
			cargaContenido("http://localhost/ajax/chaumundo.txt", "GET", muestraMensaje);
		}
		function muestraContenidosc() {
			cargaContenido("http://localhost/ajax/imagen.txt", "GET", muestraMensaje);
		}
		window.onload = muestraContenidosb;
	</script>
</head>
<!-- Aca comienza el doccumento HTML-->
<body>

<div id="contenedor">
	<div id="top" class="top">
		<img src="top_left.gif" alt="Esquina superior izquierda" class="esquina_sup_izq"/>
		<img src="top_right.gif" alt="Esquina superior derecha"  class="esquina_sup_der"/>
	</div>
	
	<div id="content" class="content">
			<div id="boxcontrol" class="boxcontrol">
				<div id="cabecera"></div>
				<div id="info"><p>Arara'a Yagua [Eco Turismo] Puerto Iguazu - Misiones - Argentiana -</p></div>
				<div id="contenedorinterno"><!--  Aca Empieza el Div que contiene la informacion interna-->
						<div id="menu"><!--  Aca Empieza el Div que contiene el menu!!!-->
								<ul id="lista">
									<li id="menulateral"><a href="#" onclick="javascript:muestraContenidosa()">Arara`a Yagua</a></li>
									<li id="menulateral"><a href="#" onclick="javascript:muestraContenidosb()">Fotos</a></li>
									<li id="menulateral"><a href="#" onclick="javascript:muestraContenidosc()">Ecoturismo</a></li>
									<li id="menulateral"><a href="#" onclick="javascript:muestraContenidosc()">Referencias</a></li>
									<li id="menulateral"><a href="#" onclick="javascript:muestraContenidosc()">Libro de Visitas</a></li>
									<li id="menulateral"><a href="#" onclick="javascript:muestraContenidosc()">Contactenos</a></li>
								</ul>
						</div><!--  Aca Finaliza Div que contiene el menu!!!-->
						<div id="datos"><p>Para poder mostrar la informacion.....</p></div>
					</div> <!--  Aca Finaliza el Div que contiene la informacion interna-->
					<div id="prueba"></div>
				</div> <!-- Fin  del div boxcontrol	-->		
	</div> <!-- Fin del div content-->		

	<div id="bottom" class="bottom">
			<img src="btm_left.gif" alt="Esquina inferior izquierda" class="esquina_inf_izq" />
			<img src="btm_right.gif" alt="Esquina inferior derecha"  class="esquina_inf_der" />
	</div>
</div>
</body>
</html> 
Siempre sigo el foro... y me gustaria, (seria importante), saber que opinan de la portada de la futura web??? ja ja espero poder hacer andar!!!

PD:. Si alguien quiere le paso toda la paguina, via mail!!!, son unos 240Kb.

Última edición por diegoy2k; 05/02/2008 a las 19:55
  #2 (permalink)  
Antiguo 05/02/2008, 22:29
 
Fecha de Ingreso: febrero-2008
Mensajes: 75
Antigüedad: 9 años, 10 meses
Puntos: 0
Re: Como posicionar este div??

Hola!

Si nadie te contesta a simple vista, y no pudiste resolverlo todavia, no tengo drama de que me pases la página vía email asi le hago una mirada; o si la tenés colgada en la web pasame la url primero y me fijo si puedo encontrar tu problemita.

Te paso por las dudas mi mail: [email protected]

Saludos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 18:43.