• Publicidad

DIV - Salto de línea

Preguntas y comentarios relacionadas con HTML y CSS.

DIV - Salto de línea

Notapor seafree » 2013-11-14 10:11 @466

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.022 segundos, usando GeSHi 1.0.8.4


Ojalá me puedan apoyar en cómo quitar el salto de línea que se genera.
seafree
Perlero Frecuente
Perlero Frecuente
 
Mensajes: 176
Registrado: 2012-08-10 11:26 @518

Publicidad

Re: DIV - Salto de línea

Notapor explorer » 2013-11-14 11:21 @514

Quizás debas cambiar el estilo CSS de ese div para que sea display: inline;
JF^D Perl Programming
Avatar de Usuario
explorer
Administrador
Administrador
 
Mensajes: 13864
Registrado: 2005-07-24 18:12 @800
Ubicación: Madrid, España

Re: DIV - Salto de línea

Notapor seafree » 2013-11-14 11:38 @526

Perfecto. Gracias, explorer.

Saludos.
seafree
Perlero Frecuente
Perlero Frecuente
 
Mensajes: 176
Registrado: 2012-08-10 11:26 @518

Re: DIV - Salto de línea

Notapor seafree » 2016-10-17 13:17 @595

¿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.015 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.
Adjuntos
menu_con_discrepancia.png
Menu_icono_adicionado
menu_con_discrepancia.png (12.89 KiB) Visto 820 veces
seafree
Perlero Frecuente
Perlero Frecuente
 
Mensajes: 176
Registrado: 2012-08-10 11:26 @518

Re: DIV - Salto de línea

Notapor explorer » 2016-10-18 02:58 @165

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.
JF^D Perl Programming
Avatar de Usuario
explorer
Administrador
Administrador
 
Mensajes: 13864
Registrado: 2005-07-24 18:12 @800
Ubicación: Madrid, España

Re: DIV - Salto de línea

Notapor seafree » 2016-10-19 10:39 @485

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.
Adjuntos
errors.rar
(27.75 KiB) 11 veces
seafree
Perlero Frecuente
Perlero Frecuente
 
Mensajes: 176
Registrado: 2012-08-10 11:26 @518

Re: DIV - Salto de línea

Notapor explorer » 2016-10-19 15:40 @695

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
JF^D Perl Programming
Avatar de Usuario
explorer
Administrador
Administrador
 
Mensajes: 13864
Registrado: 2005-07-24 18:12 @800
Ubicación: Madrid, España

Re: DIV - Salto de línea

Notapor seafree » 2016-10-19 16:01 @709

Gracias, explorer, voy a verificar cuál posibilidad es la más apropiada y te comento después.

Saludos y respetos para ti.
seafree
Perlero Frecuente
Perlero Frecuente
 
Mensajes: 176
Registrado: 2012-08-10 11:26 @518


Volver a HTML

¿Quién está conectado?

Usuarios navegando por este Foro: No hay usuarios registrados visitando el Foro y 1 invitado