Foros del Web » Creando para Internet » CSS »

Problema css no se autoajusta el alto

Estas en el tema de Problema css no se autoajusta el alto en el foro de CSS en Foros del Web. Estoy armando una web y tengo un problema de css No encuentro la forma de que el div, se acomode al alto. Me estube quemando ...
  #1 (permalink)  
Antiguo 20/09/2012, 06:11
Avatar de infiero  
Fecha de Ingreso: marzo-2006
Mensajes: 38
Antigüedad: 18 años, 1 mes
Puntos: 3
Problema css no se autoajusta el alto

Estoy armando una web y tengo un problema de css
No encuentro la forma de que el div, se acomode al alto. Me estube quemando la cabeza todo el dia...

Código HTML:
<!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>Dglabs</title>
<link rel="stylesheet" type="text/css" href="estilos.css">

<style type="text/css">



#container2 {
	width: 1000px;
	overflow: hidden;
	position: relative;
	height:700px;
}
#all_pages {
	position: absolute;
	left: 0;
	top: 0;
	width: 4000px;

}
.page {
	width: 963px;
	height: 500px;;
	float: left;
	text-align: left;
	margin-left: 20px;
}
.page2 {
	width: 963px;
	height: 600px;
	float: left;
	text-align: left;
	margin-left:37px;
}
.page3 {
	width: 963px;
	height: 600px;
	float: left;
	text-align: left;
	margin-left: 37px;
}

.page4 {
	width: 963px;
	height: 600px;
	float: left;
	text-align: left;
	margin-left: 37px;
}
.contenedortxt {
	margin-left: auto;
	margin-right:auto;
	
}

.opcioneservicios li {
	list-style:none;
	cursor:pointer;
	display:inline;
	padding-right:50px;
	font-family:Verdana, Geneva, sans-serif;
	color: #222;
	text-shadow: 1px 1px 0 #FFF;
}
.opcioneservicios li:hover {
	color: #0069d5;
	text-shadow: 1px 1px 0 #FFF;
}



.colorpueba {
	background-color:#F00;
	width:500px;
	height:500px;
}

</style>
<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" >

$(document).ready(function(){

/* ----------------------------------------------------------------------------
* Parallax 
------------------------------------------------------------------------------ */
	
	$(".link").click(function(){
		var page = $(this).attr("id");

		$('#all_pages').animate({left: (page-1)*(-1000) }); 
		$("#menu ul li").removeClass('active');
		$(this).addClass('active'); 
	});

/* ----------------------------------------------------------------------------
*  Parallax 
------------------------------------------------------------------------------ */

});

</script>
<script type="text/javascript">
//<![CDATA[
*
/* ---------------------------- */
/* Cambiar propiedad* * Multiples * * * */
/* ---------------------------- */
*
function m_oCapas() { 
 *var i,a,v,elemento,cond=m_oCapas.arguments;
 *for (i=0; i<(cond.length-2); i+=3) 
 *with (document) if (getElementById && ((elemento=getElementById(cond[i]))!=null)) { v=cond[i+2];
 * *if (elemento.style) { elemento=elemento.style; v=(v=='normal')?'#222':(v=='azul')?'#0069d5':v; }
 * *elemento.color=v; }
}
*
//]]>
</script>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div class="container">
  
  
  <!------------  Servicios  -------------->
  
  <div id="servicios1" class="divisores3"> </div>


  <div id="menu" class="opcioneservicios">
    <ul id="menuserivicos">
      <li  class="link active" id="1" onclick="m_oCapas('1','','azul','2','','normal','3','','normal','4','','normal')">Diseño web</li>
      <li  class="link" id="2" onclick="m_oCapas('1','','normal','2','','azul','3','','normal','4','','normal')">Diseño grafico</li>
      <li  class="link" id="3" onclick="m_oCapas('1','','normal','2','','normal','3','','azul','4','','normal')">Posicionamiento web</li>
      <li  class="link" id="4" onclick="m_oCapas('1','','normal','2','','normal','3','','normal','4','','azul')">Administradcion</li>
    </ul>
  </div>
  <div class="sombra4"> </div>
  <div id="container2">
    <div id="all_pages"> 
      
      <!-- inicio1 -->
      
      <div class="idea">
      <div class="page">
        <div class="contenedortxt"> <img style="padding-right:50px;" src="images/dw.png" width="349" height="264" align="left" />
          <div class="opcionesv">
            <ul id="opcionesul">
              <li><a class="opcioneswt" href="#">1.Diseño y Programación Web a medida</a><br />
                <br />
              </li>
              <span class="infodiseño">Si lo que necesitas es una web a medida estaremos encantados de asesorarte y presentarte un presupuesto sin compromiso en menos de 48 horas. Hemos desarrollado webs de gestión de cursos online, inscripción a eventos deportivos, intranets, etc.</span><br />
              <br />
              <li><a class="opcioneswt" href="#">2.Webs Corporativas</a><br />
                <br />
              </li>
              <span class="infodiseño"> Si lo que necesitas es tener tu propio espacio en Internet para que tus clientes puedan conocer tus trabajos, ubicación, instalaciones, datos de contacto, etc. sin necesidad de hacer una grán inversión, este tipo de web es la solución ideal. Te ofrecemos tu propia web con dominio y diseño exclusivo.</span><br />
              <br />
              <li><a class="opcioneswt" href="#">3.Tiendas Online<br />
                <br />
                </a></li>
              <span class="infodiseño"> Proyecta tu negocio mas allá de las puertas de tu local abriendo una tienda online las 24 horas al día. Con una inversión mínima podrás abrir tu tienda en Internet donde publicar y vender de forma cómoda todos tus productos. Si estás interesado contacta con nosotros y te informaremos de las distintas soluciones de comercio electrónico sin compromiso.</span><br />
              <br />
              <li><a class="opcioneswt" href="#">4.Catálogos Virtuales</a><br />
                <br />
              </li>
              <span class="infodiseño"> Si quieres mostrar tu catálogo de productos a clientes o visitantes, te ofrecemos la posibilidad de crear un catálogo virtual donde podrás crear fácilmente toda tu oferta comercial. Catálogos con perfiles de acceso donde podrás exponer tus productos según el perfil de tus clientes (potenciales, afianzados o simples visitantes). Tu oferta accesible para todo el mundo!</span><br />
              <br />
              <li><a class="opcioneswt" href="#">5.Gestores de contenido (CMS)</a><br />
                <br />
              </li>
              <span class="infodiseño">Trabajamos con los principales gestores de contenido (Wordpress, Joomla, Drupal, etc.) creando y maquetando diseños exclusivos o programando módulos personalizados. También ofrecemos alojamiento web por 120 € al año para tu CMS.</span><br />
              <br />
              <li><a class="opcioneswt" href="#">6.Blogs y portafolios</a><br />
                <br />
              </li>
              <span class="infodiseño">Creamos la imagen de tu blog adaptando cualquier diseño a tu gestor de contenidos o blog. Si necesitas presentar tus trabajos online creamos tu portafolios.</span>
            </ul>
          </div>
        </div>
      </div>
      
      <!-- fin1--> 
      
      <!-- inicio2 -->
      <div class="page2">
        <div class="contenedortxt">
          <div class="prueba"><img style="padding-right:50px; " src="images/dg.png" width="321" height="222" align="left" /></div>
          <div class="opcionesv">
            <ul id="opcionesul">
              <li><a class="opcioneswtverde" href="#">1.Diseño de páginas web</a><br />
                <br />
              </li>
              <span class="infodiseño">Si quieres destacar entre el resto y distinguirte cualitativamente de tu competencia, diseñamos de forma exclusiva la imagen de tu web. También podemos maquetarla por ti, garantizamos la validación XHTML y CSS de todo nuestro código.</span><br />
              <br />
              <li><a class="opcioneswtverde" href="#">2.Diseño de logotipos</a><br />
                <br />
              </li>
              <span class="infodiseño"> Nuestro logotipo representa la imagen de nuestra empresa en la mínima expresión, ha de captar el concepto de nuestro proyecto y distinguirse entre los demás. Diseñamos tu logotipo, déjanos sorprenderte!</span><br />
              <br />
              <li><a class="opcioneswtverde" href="#">3.Diseño de tarjetas<br />
                <br />
                </a></li>
              <span class="infodiseño"> Si quieres que tus tarjetas se diferencien de entre las demás y no caigan en el olvido te ofrecemos soluciones de diseño e impresión de tarjetas de visita</span><br />
              <br />
              <li><a class="opcioneswtverde" href="#">4.Diseño de material corporativo</a><br />
                <br />
              </li>
              <span class="infodiseño"> Creamos la imagen de tu empresa, desde el diseño de tu portal hasta el material impreso. Solicitanos presupuesto sin compromiso.</span><br />
              <br />
              <li><a class="opcioneswtverde" href="#">Diseño de folletos</a><br />
                <br />
              </li>
              <span class="infodiseño">Realizamos trabajos de diseño de material para ferias, folletos (trípticos, dípticos, etc.).</span><br />
              <br />
            </ul>
          </div>
        </div>
      </div>
      <!-- fin2 --> 
      
      
      
    </div>
    <!-- #all_pages --> 
    
  </div>
  <!-- #container --> 
  </div>
  
  <!------------  Servicios Fin  --------------> 
  
  <div class="colorpueba"> </div>
  
</div>
</body>
</html> 
  #2 (permalink)  
Antiguo 20/09/2012, 07:52
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 14 años, 10 meses
Puntos: 269
Respuesta: Problema css no se autoajusta el alto

googlea "columnas de igual alto" / "css equal height columns", hay trucos varios. Lamento no tener tiempo de leer todo el código.
Espero te sea de ayuda. Saludos.
  #3 (permalink)  
Antiguo 20/09/2012, 10:26
Avatar de infiero  
Fecha de Ingreso: marzo-2006
Mensajes: 38
Antigüedad: 18 años, 1 mes
Puntos: 3
Respuesta: Problema css no se autoajusta el alto

Gracias, estube probando y la verdad que nada me va a sacar canas verdes este problema

Última edición por infiero; 20/09/2012 a las 10:40
  #4 (permalink)  
Antiguo 20/09/2012, 11:28
Avatar de flashmax  
Fecha de Ingreso: julio-2012
Ubicación: Bs.As. Argentina
Mensajes: 507
Antigüedad: 11 años, 9 meses
Puntos: 86
Respuesta: Problema css no se autoajusta el alto

Hola cual es el div que quieres acomodar a lo alto? saludos!
__________________
Saludos!
----------------------------------------------------------
  #5 (permalink)  
Antiguo 21/09/2012, 08:39
Avatar de infiero  
Fecha de Ingreso: marzo-2006
Mensajes: 38
Antigüedad: 18 años, 1 mes
Puntos: 3
Respuesta: Problema css no se autoajusta el alto

si miras el codigo es un efecto parallax con un cotenedor el contenedor no se ajusta al tamaño de los demas divs
  #6 (permalink)  
Antiguo 22/09/2012, 11:16
 
Fecha de Ingreso: septiembre-2012
Ubicación: Couña
Mensajes: 9
Antigüedad: 11 años, 7 meses
Puntos: 3
Respuesta: Problema css no se autoajusta el alto

Puedes mandar algo más de información y una captura? No entiendo bien la consulta, a qué quieres que se autoajuste? Al alto de cada navegador?

Etiquetas: alto, contenido, hover, html, fondo
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 14:24.