¿Y este espacio en blanco?

  • Autor Autor Pcx89
  • Fecha de inicio Fecha de inicio
P

Pcx89

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola!!, les cuento lo que me está pasando.
Tengo una sección con texto y al final una tabla, pero en la tabla me aparece una fila en blanco que no puedo quitar, me fijé con la herramienta "Inspeccionar elemento" y me aparece:
br1.webp
Con esa imágen todo da a entender que el problema estaría en el código. Bien, pero voy al código y los <br> no aparecen. (Me fijé 30 veces XD).
Y me pasa con los anvegadores Chrome, Firefox y Opera.

¿Alguien tiene idea que tengo que hacer? XD

El espacio en blanco es:
espacio.webp

El código de Datagrid es:
Insertar CODE, HTML o PHP:
				<div class="datagrid">
					<table>
						<tbody>
							<tr class="alt">
								<td><p><b>Dato1:</b></p></td>
								<td><p>x</p></td>
							</tr>
											
							<tr>
								<td><p><b>Dato2:</b></p></td>
								<td><p>x</p></td>
							</tr>
							
							<tr class="alt">
								<td><p><b>Dato3:</b></p></td>
								<td><p>x</p></td><br>
							</tr>
							
							<tr>
								<td><p><b>Dato4:</b></p></td>
								<td><p>x</p></td><br>
							</tr>
							
							<tr class="alt">
								<td><p><b>Dato5:</b></p></td>
								<td><p>x<br></p></td>
							</tr>
						</tbody>
					</table>
				</div>

Y por las dudas, el código CSS:
Insertar CODE, HTML o PHP:
.datagrid {width: 50%; font-size: 12px; font-family: Arial, Helvetica, sans-serif; background: #fff; overflow: hidden; border: 1px solid #A4A4A4; -webkit-border-radius: 2px; -moz-border-radius: 2px;}
.datagrid table {width: 100%; border-collapse: collapse; text-align: left;} 
.datagrid table td, 
.datagrid table th {padding-top: 2px; padding-left: 2px; padding-right: 2px; padding-bottom: 2px;}
.datagrid table tbody td {color: #00557F; border-left: 1px solid #E1EEF4; font-size: 12px; font-weight: normal;}
.datagrid table tbody .alt td {background: #E1EEf4; color: #00557F;}
.datagrid table tbody td:first-child {border-left: none;}
.datagrid table tbody tr:last-child td {border-bottom: none;}
tr {display: table-row; vertical-align: inherit; border-color: inherit;}
.term{padding-left: 4px;}


La verdad.. todo muy raro XD
 
Última edición:
Prueba con <br />
Justamente la idea es que no tener el espacio XD. En el código no lo tengo, pero en el Inspector de elemento me aparece, es rarísimo :O
 
Justamente la idea es que no tener el espacio XD. En el código no lo tengo, pero en el Inspector de elemento me aparece, es rarísimo :O

mmm puede que no aparescan como <br> sino que sean saltos de linea... que editor usas? o pasame la url por PM y veo...
 
Oh, ya entendi, misma pregunta que cicklow, que editor usas?, muchos editores y más aún del estilo wysiwyg agregan saltos de linea, no utilizas codepress ¿o si?
 
mmm puede que no aparescan como <br> sino que sean saltos de linea... que editor usas? o pasame la url por PM y veo...

Oh, ya entendi, misma pregunta que cicklow, que editor usas?, muchos editores y más aún del estilo wysiwyg agregan saltos de linea, no utilizas codepress ¿o si?

No puedo pasar Link ya que es un Sitio para un cliente, entiendan XD
Ahora probé de quitar <table> </table> y si bien no quedan las filas y columnas (obvio 😛) el salto de línea tampoco aparece, supongo que es por ahí el problemilla XD
 
HTML:
.datagrid table th {padding-top: 2px; padding-left: 2px; padding-right: 2px; padding-bottom: 2px;}

intenta cambiar por

HTML:
.datagrid table th {padding-top: 0px; padding-left: 2px; padding-right: 2px; padding-bottom: 0px;}

En realidad es complicado sin poder ver el sitio :devilish:
 
Les comento que solucioné el error. 😀
Busqué sitios para generar tablas automáticamente, me encontré con HTML Table Style Generator by eli geske
Y adapté el CSS a mi Web:
Insertar CODE, HTML o PHP:
.datagrid {width: 50%;}
.datagrid table {border-collapse: collapse; text-align: left; width: 100%;}
.datagrid {font: normal 12px/150% Arial, Helvetica, sans-serif; background: #fff; overflow: hidden; border: 1px solid #006699; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
.datagrid table td, .datagrid table th { padding: 3px 2px;}
.datagrid table tbody td {color: #00496B; font-size: 12px;font-weight: normal;}
.datagrid table tbody .alt td { background: #E1EEF4; color: #00496B; }
.datagrid table tbody td:first-child {border-left: none;}
.datagrid table tbody tr:last-child td {border-bottom: none;}

Dejo la explicación por si a alguien mas le sirve XD

Gracias por sus respuestas!
 
Última edición:
Enhorabuena igual si mal no estoy el problema eran los padding
 
Atrás
Arriba