Página 1 de 1

DIV - Salto de línea

NotaPublicado: 2013-11-14 10:11 @466
por seafree
Hola a todos, estoy utilizando DIV y me generan salto de línea:

Sintáxis: [ Descargar ] [ Ocultar ]
Using html4strict Syntax Highlighting
  1. <td colspan=4 bgcolor="#FFFFFF"><span class="style1">FECHA:</span>
  2.         <div id="listaEventos" style="white-space: nowrap;">
  3.         <input type="text" size="13"  name="date1" class="tcal" id="sel1" value=""  onBlur="carga_eventos(subestacion.value,this.value);">
  4.         </div>
  5.  
  6.         <input type=text size=2  maxlength=2 name=salehora onBlur="validate(this);">
  7.  
  8.                    <B> : </B>
  9.                    <input type=text size=2 maxlength=2 name=salemin onBlur="validate2(this)">
  10.                         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  11.                         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
Coloreado en 0.002 segundos, usando GeSHi 1.0.8.4


Ojalá me puedan apoyar en cómo quitar el salto de línea que se genera.

Re: DIV - Salto de línea

NotaPublicado: 2013-11-14 11:21 @514
por explorer
Quizás debas cambiar el estilo CSS de ese div para que sea display: inline;

Re: DIV - Salto de línea

NotaPublicado: 2013-11-14 11:38 @526
por seafree
Perfecto. Gracias, explorer.

Saludos.

Re: DIV - Salto de línea

NotaPublicado: 2016-10-17 13:17 @595
por seafree
¿Qué tal? explorer, de acuerdo a tu apoyo acerca del DIV, tengo una nueva problemática: sucede que tengo un menú generado con una UL y, por supuesto, estoy usando "display:inline;". Sin embargo, sucede que del lado derecho del menú se muestra una imagen y no logro esconderla.

Como siempre, agradeceré tu valioso y gran apoyo, te envío parte del código donde existe el problema:

Sintáxis: [ Descargar ] [ Ocultar ]
Using html4strict Syntax Highlighting
  1. <html>
  2. <head>
  3. ...
  4. </head>
  5. <body>
  6.     <div>
  7.         <img src="../images/sifamep/encabezado.png" width="1200" height="93">
  8.     </div>
  9.     <div name="fecha" align="right" style="display:inline;"><font color="#000000" size="2"><strong><script>document.write(TODAY)</script></font></div>
  10.     <div id="menu" style="white-space: nowrap; display:inline;">
  11.         <ul class="menu">
  12.             <li>..............................................</li>
  13.             <li>..............................................</li>
  14.             <li>..............................................</li>
  15.         </ul>
  16.     </div>
  17.     <br> <br> <br> <br>
  18.     BREVE TEXTO......
  19.     <div style="visibility:hidden" id="copyright">Copyright &copy; 2016 <a href="...">Menus</a></div>
  20.     <div id="copyright">Copyright &copy;</div>
  21. </body>
  22. </html>
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4

La pregunta es: ¿cuál es la razón por la que en la página se muestra un icono de color verde después de la fecha, si nunca la pongo? Te envío muestra de la interfaz que se genera.

Espero me puedas apoyar porque no encuentro el motivo. Nuevamente, mil gracias y saludos.

Re: DIV - Salto de línea

NotaPublicado: 2016-10-18 02:58 @165
por explorer
El código HTML no está bien formado: la marca <strong> no está cerrada.

Si quieres saber a qué pertenece un elemento de la pantalla, debes usar las herramientas de inspección de elementos, que traen ahora los navegadores web. Yo, en el Firefox, lo saco del menú Herramientas->Desarrollor Web->Inspector. Pulsas en el icono con forma de flecha y te vas a la página y pulsas sobre el elemento, y te localiza en la ventana de abajo qué código HTML lo genera.

Re: DIV - Salto de línea

NotaPublicado: 2016-10-19 10:39 @485
por seafree
Buenos días, explorer, gracias por tu apoyo. Al pulsar sobre el elemento que NO SE DEBE VISUALIZAR me genera las siguientes ventanas de mensaje de error en el estilo, las cuales anexo, así como el archivo de estilo menu.css.

Espero sirvan de apoyo para dar con el error, el cual debe ser simple pero no lo veo :(


Mil gracias una vez más, explorer.

Re: DIV - Salto de línea

NotaPublicado: 2016-10-19 15:40 @695
por explorer
Es un elemento gráfico que define menu.css como parte de una entrada de menú horizontal (para eso sirve menu.css).

En las capturas, no veo la posición donde está tu capa. Pero el problema de las capas 'inline', es que si están en la misma línea o altura, se comportarán como palabra de una línea de texto: unas se pegarán a otras, a continuación.

Entonces... debes cambiar la posición de definición de tu capa, para que no se iguale en altura con otras capas. Muchas veces se resuelve poniéndola relativa (relative) a una capa padre, o haciéndola flotante (float). Finalmente, si no queda más remedio, se le pone fija (fixed) o en posiciones absolutas (absolute). Hoy en día, lo moderno es usar flex, para que los elementos se ajusten según el tamaño de pantalla del dispositivo.

Tienes que estudiar todas estas posibilidades. Con el mismo visor del navegador que has utilizado para sacar la parte extraña, haz lo mismo con tu fecha, y podrás jugar a editar los estilos y propiedades de tu capa, directamente en el navegador, hasta que encuentres la configuración que más quieres.

Por Internet hay ejemplos de cómo se distribuyen las capas según el tipo de 'display'.

¿Has probado con 'inline-block'? http://es.learnlayout.com/inline-block.html

Re: DIV - Salto de línea

NotaPublicado: 2016-10-19 16:01 @709
por seafree
Gracias, explorer, voy a verificar cuál posibilidad es la más apropiada y te comento después.

Saludos y respetos para ti.