Foros del Web » Creando para Internet » CSS »

anidar div

Estas en el tema de anidar div en el foro de CSS en Foros del Web. Hola Tengo una página en la que quiero mostrar dos div anidados, cada uno con un estilo propio, que esta almacenado en una hoja de ...
  #1 (permalink)  
Antiguo 28/02/2007, 07:15
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
anidar div

Hola
Tengo una página en la que quiero mostrar dos div anidados, cada uno con un estilo propio, que esta almacenado en una hoja de estilos en el servidor, para poder verla os pego esto:

<div style="display: block;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size: 10px;font-style: normal;font-weight: normal;line-height: 1.4em;color: #5D93BF;position: relative;padding-top: 0px;width: 100%;background-color:green;overflow: visible;z-index:0">


<div style="display: block;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size: 10px;font-style: normal;font-weight: normal;line-height: 1.4em;color: #5D93BF;position:relative;float:left;padding-top: 0px;overflow: visible;z-index:1">
......aqui hay una tabla que se muestra
</div>
</div>

Bien, el problema es que en lugar de salir anidados salen uno a continuacion del otro, incluso la tabla

Podriais decirme pq??

Gracias
__________________

La belleza verdadera es la de las almas buenas
  #2 (permalink)  
Antiguo 28/02/2007, 09:25
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 22 años, 2 meses
Puntos: 772
Re: anidar div

Mensaje movido al foro de Css desde Editores Web.

Saludos,
  #3 (permalink)  
Antiguo 28/02/2007, 09:46
Avatar de Nefertiter  
Fecha de Ingreso: enero-2003
Ubicación: Rosario
Mensajes: 1.316
Antigüedad: 21 años, 3 meses
Puntos: 9
Re: anidar div

es que tienes display: block; eso implica que elemento se mostraria como "bloque" (? tururu) y x lo tanto no le gustan otro se le meta adentro :P

elimina el display y fijate com ote va.
  #4 (permalink)  
Antiguo 28/02/2007, 09:59
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
Re: anidar div

errrrrrrrrr................ vale

un poco solucionado, pero no del todo, a ver:

<div style="overflow: visible;background-repeat: no-repeat;width: 750px;height: 405px;position: relative;left: 215px;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size: 10px;font-style: normal;color: #4C5D93;font-weight: normal;line-height: 1.4em; overflow:visible;">
<table>
<tr>
<td>
...codigo por aki....
</cierro tr y td>
<div style="font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;font-size: 10px;font-style: normal;color: #000B6E;overflow: hidden; padding-top: 30px;position: relative;">
<a href="javascript:history.back()"><img src="img/bot_volver_on.gif"/></a><br><br><br><br>
</div>
</table>
</div>


Y en lugar de meterlo dentro del anterior lo pinta debajo, incluso debajo del pie de pagina......
__________________

La belleza verdadera es la de las almas buenas
  #5 (permalink)  
Antiguo 28/02/2007, 12:33
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 6 meses
Puntos: 280
Re: anidar div

Cita:
Iniciado por chikiya Ver Mensaje
<table>
<tr>
<td>
...codigo por aki....
</cierro tr y td>
<div style="font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;font-size: 10px;font-style: normal;color: #000B6E;overflow: hidden; padding-top: 30px;position: relative;">
<a href="javascript:history.back()"><img src="img/bot_volver_on.gif"/></a><br><br><br><br>
</div>
</table>
</div>
¿Qué significa eso de </cierro tr y td>, y sin embargo cierras la tabla al final y sin cerrar td ni tr? No lo pillo.
¿Quieres decir que ahí cierras el td y tr y abres otro? ¿o es que metes ese div después de haber cerrado el tr pero antes de cerrar el table? Si es así, ahí está el error.

¿Podrías poner el código completo, sin ahorrar, para buscar el problema?

Mikel.
  #6 (permalink)  
Antiguo 01/03/2007, 02:04
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
Re: anidar div

si, lo que hago es eso, se cierra tr y td antes del div nuevo. Ahora mismo no puedo pegar el codigo porque no me va el servidor, en cuanto me conecte lo pego
__________________

La belleza verdadera es la de las almas buenas
  #7 (permalink)  
Antiguo 01/03/2007, 02:30
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
Re: anidar div

<div style="overflow:visible;background-repeat: no-repeat;width: 750px;height: 405px;position: relative;left: 215px;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size: 10px;font-style: normal;color: #4C5D93; font-weight: normal;line-height: 1.4em;overflow:visible;">
<table>
<tr>
<td valign="top">
<div id="descripcion_servicio">
<span class="texto_secserv">
<ics:getvar name="textoDescripcion" encoding="default" output="txt"/><render:stream variable="txt"/></span>
<script language="javascript">
var documentos = Array();
function abrirDocumento(numDoc){
if (documentos[numDoc]){
window.location = documentos[numDoc];
}else{
alert("No se ha encontrado el documento solicitado.");
}
}
</script>
<%
int numDocumentos = 1;
%>
<table width="80%">
<%
String mostrarTitulo = "false";
for (int i=1;i<21;i++){
if ( ics.GetVar("a:urldocumento"+i+"_file")!=null && !(ics.GetVar("a:urldocumento"+i+"_file")).equals(" ") ){
if (mostrarTitulo.equals("false")){
mostrarTitulo = "true";
%>
<tr><br><br></tr>
<tr><td colspan="2"><STRONG>Documentos anexos:</STRONG></td></tr>
<tr><td colspan="2"></td></tr>
<%
}
if (numDocumentos % 2 != 0) {
%>
<tr>
<%
}
%>
<td width="50%">
<%
String nombre = "a:urldocumento"+i+"_file";
int indice = ics.GetVar(nombre).lastIndexOf(".");
String extension = ics.GetVar(nombre).substring(indice+1);
String consulta = "SELECT mimetype FROM MimeType WHERE extension='" + extension + "'";
String header = "";
%>
<ics:sql sql='<%=consulta%>' listname="lstMime" table="MimeType"/>
<%
IList lstMime = ics.GetList("lstMime");
if (lstMime!=null && lstMime.hasData()){
header = lstMime.getValue("mimetype");
lstMime.flush();
}
%>
<render:getbloburl blobnocache="true" blobheader='<%=header%>' blobtable="Servicio" blobcol='<%="urldocumento"+i%>' blobkey="id" blobwhere='<%=ics.GetVar("idS")%>' outstr="urlpath">
<render:argument name="blobheadername0" value="content-type"/>
<render:argument name="blobheadervalue0" value="application/octet-stream"/>
<render:argument name="blobheadername1" value="content-disposition"/>
<render:argument name="blobheadervalue1" value='<%= "attachment; filename="+ics.GetVar(nombre)%>'/>
</render:getbloburl>
<p><img src="img/icono_<%=extension%>.gif" width="20" height="20" valign="top" align="left" vspace="0" hspace="0">&nbsp;&nbsp;<a href='<%=ics.GetVar("urlpath")%>'/><ics:getvar name='<%=nombre%>'/></a></p>
<script language="javascript">
documentos[<%=i%>] = '<%=ics.GetVar("urlpath")%>';
</script>

</td>
<%
if(numDocumentos % 2 == 0) {
%>
</tr>
<%
}
numDocumentos ++;
}
}//fin del for

if(numDocumentos % 2 == 0 ) {
%>
<td width="50%"></td></tr>
<%
}
%>
</table>
</div>

<div style="display:block;font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;font-size: 10px;font-style: normal;color: #000B6E;padding-top: 30px;position: relative;">
<a href="javascript:history.back()"><img src="img/bot_volver_on.gif"/></a><br><br><br><br>
</div>

</td>
</tr>
</table>
</div>

Bueno, ahi esta, quite algun codigo por medio de content server, porque sino es un rollo, pero no cierro el tr ni el td antes del div.y pinta el ultimo div por debajo del pie de pagina...
__________________

La belleza verdadera es la de las almas buenas
  #8 (permalink)  
Antiguo 01/03/2007, 03:12
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 6 meses
Puntos: 280
Re: anidar div

Bueno, a simple vista y sin problarlo te puedo decir lo que veo:

<tr><br><br></tr> - Esto no hace nada, porque no puede haber un tr sin td.

Dentro de una tabla, asbsolutamente todo debe estar contenido en una celda, que es la unidad mínima de la tabla. No puedes poner cosas fuera de una celda:

<tr><td></td></tr>
cualquier cosa
<tr><td></td></tr>

No es posible, porque eso estaría entremedio de la tabla y dentro de "nada". Es mi opinión.

Con tanto script no puedo ver bien lo que se pretende hacer. Si puedes subirlo a un servidor para verlo sería más fácil.

Mikel.
  #9 (permalink)  
Antiguo 01/03/2007, 03:21
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
Re: anidar div

//69.56.49.170/ContentServer/Satellite?cid=1153722860149&idS=1153722860036&page name=TIWSPortalEmpleado%2FPage%2FPaginaGenerica&re ndermode=preview-loli-1151398335635&tipoS=Servicio

no se si podras verla. El problema esta en la paginacion, que aparece por debajo del pie, en firefox, que en explorer 6 se ve bien
__________________

La belleza verdadera es la de las almas buenas
  #10 (permalink)  
Antiguo 01/03/2007, 03:26
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 6 meses
Puntos: 280
Re: anidar div

No, no puedo.
  #11 (permalink)  
Antiguo 01/03/2007, 03:38
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
Re: anidar div

a ver, hay una serie de div, anidados, yo creo que el problema esta en el display:block, pero creo que ya los he kitado todos.

La pagina tiene un elemento centro que tiene que contener un div de titulo, una tabla con noticias y otra tabla que contiene enlaces a las paginas siguientes. y luego un pie de pagina que es fijo.

Pues bien, la tabla de los enlaces a otras paginas se coloca debajo del pie..., no consigo que se coloque dentro del div de centro y a continuacion de la tabla de noticias
__________________

La belleza verdadera es la de las almas buenas
  #12 (permalink)  
Antiguo 01/03/2007, 04:01
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
Re: anidar div

Mas aclaraciones:
tengo un div, que contiene un formulario, q es este:

<div style="font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size: 10px;font-style: normal;font-weight: normal;line-height: 1.4em;color: #5D93BF;position: relative;padding-top: 0px;width: 100%;overflow:visible;">

<form id="FormNoticias" name="FormNoticias" method="post" action='<%=ics.GetVar("urlNoticia")%>'>
</form>
El formulario a su vez contiene una tabla, pero ahi no esta el problema. El problema está en que hay otro div que contiene todo esto, que no se redimensiona al aumentar el tamaño de este div. Es posible que firefox no interprete bien el overflow:visible??
__________________

La belleza verdadera es la de las almas buenas
  #13 (permalink)  
Antiguo 01/03/2007, 04:28
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
Re: anidar div

Mas aclaraciones:

Este es el div del problema, que no me coge la tabla como suya, y la tabla es mas grande que el div...

<div style="background-repeat: no-repeat;width: 750px;height: 405px;position: relative;left: 215px;font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size: 10px;font-style: normal;color: #4C5D93;font-weight: normal;line-height: 1.4em;overflow:visible;background:lightgrey;"><%//centro%>
<table><%//la tabla contiene:titulo noticias,formulario de noticias,paginacion,boton volver%>
<tr>
<td valign="top">
<div style="font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-size: 10px;font-style: normal;font-weight: normal;line-height: 1.4em;position:relative;padding-top: 40px;tom: 20px;*/width: 100%;"><%//bloque del titulo noticias%>

<span class="texto_secserv"><ics:getvar name="textoDescripcion" encoding="default" output="txt"/><render:stream variable="txt"/></span>
<span class="texto_secserv"><ics:getvar name="a:descripcion" encoding="default" output="txt"/><render:stream variable="txt"/></span>

<table width="80%">
<tr><td><br><br></td></tr>
<tr><td colspan="2"><STRONG>Documentos anexos:</STRONG></td></tr>
<tr><td colspan="2"></td></tr>
<tr>
<td width="50%">
</td> </tr>
<td width="50%"></td>
</tr>
</table>
</div>

<table width="100%">
<tr>
<tr>
<td>
&nbsp;
</td>
</tr>
<td>
</td>
</tr>
</table>
<br>

<div style="display:block;font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;font-size: 10px;font-style: normal;color: #000B6E;padding-top: 30px;position: relative;">
<a href="javascript:history.back()"><img src="img/bot_volver_on.gif"/></a><br><br><br><br>
</div>

</td>
</tr>
</table>
</div>
__________________

La belleza verdadera es la de las almas buenas
  #14 (permalink)  
Antiguo 01/03/2007, 06:14
Avatar de chikiya  
Fecha de Ingreso: mayo-2006
Mensajes: 46
Antigüedad: 17 años, 11 meses
Puntos: 0
Re: anidar div

Bueno, arreglado, añadiendo el display:inline a los bloques padres que por alguna razon no los coge por defecto

Gracias
__________________

La belleza verdadera es la de las almas buenas
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 07:00.