Foros del Web » Creando para Internet » CSS »

dar longitud a una linea

Estas en el tema de dar longitud a una linea en el foro de CSS en Foros del Web. Quisiera poder poner una linea entre dos celdas de una tabla, pero que la linea mida una determinada longitud, es decir no quiero que toque ...
  #1 (permalink)  
Antiguo 25/08/2010, 16:00
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 10 meses
Puntos: 5
dar longitud a una linea

Quisiera poder poner una linea entre dos celdas de una tabla, pero que la linea mida una determinada longitud, es decir no quiero que toque arriba ni abajo, que deje unos 10 pixeles por abajo y otros tantos por arriba.

es posible??
  #2 (permalink)  
Antiguo 25/08/2010, 17:10
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: dar longitud a una linea

Podrías hacerlo con el tag <hr />, con css le puedes dar ancho, alto y jugar con los margenes y rellenos.

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es-es">
  3. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  4. <style type="text/css">
  5.     #cont{width: 800px;margin: 0 auto;}
  6.     p{margin-left:20px; }
  7.     hr{width: 780px;height: 2px;background: #CCC; margin:10px auto;}
  8. </head>
  9. <div id="cont">
  10.     <p>Aqui va texto</p>
  11.     <hr />
  12.     <p>Aqui va mas texto</p>
  13. </div>
  14. </body>
  15. </html>
__________________
WFC
codigo82
  #3 (permalink)  
Antiguo 25/08/2010, 17:41
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 10 meses
Puntos: 5
Respuesta: dar longitud a una linea

el problema es que no lo quiero en horizontal, sino en vertical, una linea vertical para separar dos celdas. Pero si con CSS no se puede ya me apañocreando otra celda, el problema es que la linea que quiero crear es discontinua
  #4 (permalink)  
Antiguo 26/08/2010, 07:43
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: dar longitud a una linea

Cita:
Iniciado por 00israel Ver Mensaje
el problema es que no lo quiero en horizontal, sino en vertical, una linea vertical para separar dos celdas. Pero si con CSS no se puede ya me apañocreando otra celda, el problema es que la linea que quiero crear es discontinua
Yo también doy las gracias por el tiempo y saberes desperdiciados en responder a una cuestión mal planteada.

Aunque la culpa por dar una respuesta desencaminada es tuya, Pater Willy, por no molestarte en trabajar con el código facilitado por el postulante.
Oh, wait!! Where is it?

Atentamente

P.D.: ni con css ni con nada se puede hacer aquello que se desconoce qué es lo que hay que hacer.
  #5 (permalink)  
Antiguo 26/08/2010, 12:05
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 10 meses
Puntos: 5
Respuesta: dar longitud a una linea

¿perdona? creo que me he explicado bien. Si no me has entendido, me lo haces saber y te lo vuelvo a explicar. Presupones y ademas con arrogancia, algo que desconoces si he hecho o no, que es molestarme en comprobar la ayuda que me han prestado. Asi se que es mejor que te abstengas de participar en este post.
  #6 (permalink)  
Antiguo 26/08/2010, 13:52
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: dar longitud a una linea

¿Sigue sin entender usted que la recriminación implícita en mis palabras fue por la total ausencia de un simple "gracias" hacia quién le regaló su tiempo y conocimientos? Y que en vez de eso, agradecimiento, sólo muestra usted otra exigencia.

Como verá, hago caso omiso a su ¿deseo/orden? de participar sólo donde usted me indique.

Atentamente
  #7 (permalink)  
Antiguo 26/08/2010, 14:01
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 10 meses
Puntos: 5
Respuesta: dar longitud a una linea

exigencia???

que te has tomado?? efectivamente puede que me haya faltado un gracias, pero no deja de ser un discurrir hacia donde quiero llegar. No creo que se haya sentido ofendido y si asi fuera deberia de ser él quien lo diga no tu.

hoy no has tomado mucha fibra por la mañana no? pues te lo aconsejo, ya veras como sonries un poquito.
  #8 (permalink)  
Antiguo 26/08/2010, 15:25
 
Fecha de Ingreso: agosto-2008
Mensajes: 49
Antigüedad: 9 años, 4 meses
Puntos: 0
Respuesta: dar longitud a una linea

Tal y como te comentaron. Dando formato a <hr/> puedes indicarle ancho y alto deseado.

Prueba con hr{width: 2px; height: 100px;}

Hoy he aprendido una cosa más. Jejeje.

Gracias y saludos.
  #9 (permalink)  
Antiguo 26/08/2010, 16:29
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: dar longitud a una linea

Cita:
Iniciado por Caquilla23 Ver Mensaje
Tal y como te comentaron. Dando formato a <hr/> puedes indicarle ancho y alto deseado.

Prueba con hr{width: 2px; height: 100px;}

Hoy he aprendido una cosa más. Jejeje.

Gracias y saludos.
Esto en España se conoce como dialogo de besugos. Caquilla23, lo que piden, y le doy parte de razón a Kseso?, puesto que es un juego de presuponer y adivinar, es que la linea sea vertical. Con <hr/> se consigue horizontal.

00israel, podrías dejar de batallar un rato y aclararnos estas dudas.

Un saludo
__________________
Revisa las FAQ's antes de disparar.
  #10 (permalink)  
Antiguo 27/08/2010, 03:25
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 10 meses
Puntos: 5
Respuesta: dar longitud a una linea

efectivamente esto parece un dialogo de besugos. Pero no se, cuantas mas veces leo la pregunta que hice, mas claro lo veo.

a ver, tengo una tabla con dos columnas y dos celdas, en la celda de la izquierda tengo una imagen y en la de la derecha tengo otra. Bien pues quiero que entre las dos haya una linea punteada vertical imaginate de 20 pix, teniendo en cuenta que el alto de tabla son unos 50 pix. Es solo eso

Lo que me plantea caquilla, gracias caquilla. Lo he probado y si crea una linea vertical, pero claro, como le aplico eso a la tabla? y tampoco podria hacerla punteada no?
  #11 (permalink)  
Antiguo 27/08/2010, 03:32
Avatar de pann84  
Fecha de Ingreso: agosto-2010
Ubicación: Asturias - Madrid
Mensajes: 95
Antigüedad: 7 años, 4 meses
Puntos: 4
Respuesta: dar longitud a una linea

Pon tu código y así seguro que vemos más fácilmente como poder ayudarte, pero así a ciegas no podemos más que especular...
  #12 (permalink)  
Antiguo 27/08/2010, 03:39
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 10 meses
Puntos: 5
Respuesta: dar longitud a una linea

Yo te pongo el codigo pero no entiendo, si acabo de crear una tabla de 600 px, con dos celdas de 300 de altura, un texto a la izquierda y otro a la derecha. no es mas.

Lo que quiero es poder poner una linea entre las dos celdas. Algo que podria hacer perfectamewnte con otra columna o indicando con CSS que me pusiera una de las celdas un borde y listo. Pero quiero que esa linea vertical no mida todo el alto de la celda sino que mida por ejemplo 100px:

Código:
<!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>Documento sin t&iacute;tulo</title>
</head>

<body>
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="300"><p>aklsdflaksjdflkasjdf</p>
    <p>asdlfkjasldkfjasd</p>
    <p>asldkfjlaksjdf</p></td>
    <td width="300"><p>adlsfñlkasñdflkasdfñlk </p>
    <p>asdñflñasldkf</p>
    <p>asdñfñlkñlkñlk</p></td>
  </tr>
</table>
</body>
</html>
  #13 (permalink)  
Antiguo 27/08/2010, 11:10
 
Fecha de Ingreso: agosto-2008
Mensajes: 49
Antigüedad: 9 años, 4 meses
Puntos: 0
Respuesta: dar longitud a una linea

Podrías utilizar una imagen con el dibujo de la linea. Con z-index la posicionas debajo de la imagen a mostrar en la celda y con position la desplazas unos pixeles a la derecha.

Algo así como la técnica utilizada para aplicar sombras a las imágenes sólo que en vez de una sombra es una linea vertical.

http://www.alistapart.com/articles/cssdropshadows/
  #14 (permalink)  
Antiguo 27/08/2010, 11:18
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 10 meses
Puntos: 5
Respuesta: dar longitud a una linea

puede ser una solucion, la historia es que serian bastantes porque tengo varias paginas con distintos tamaños.

pero puede ser una solucion, gracias caquilla
  #15 (permalink)  
Antiguo 27/08/2010, 11:27
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: dar longitud a una linea

bueno, para lo primero planteado(el asunto de la línea), podría ser una solución la siguiente:

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  4. <title>Documento sin t&iacute;tulo</title>
  5. <style  type="text/css">
  6.    table{width: 600px;background: #CCC;margin: 0 auto; border: 0}}
  7.     .izq{width: 250px;padding: 15px}
  8.     .der{width: 300px}
  9.     .cont_izq{padding: 10px;margin: 5px auto;}
  10.     .cont_der{padding: 10px 10px 10px 40px;margin: 5px auto;border-left: 1px solid #000}
  11.      p{padding:0 0 5px 10px;}
  12. </head>
  13.  
  14. <table cellpadding="0" cellspacing="0">
  15.   <tr>
  16.     <td class="izq">
  17.         <div class="cont_izq">
  18.             <p>aklsdflaksjdflkasjdf</p>
  19.             <p>asdlfkjasldkfjasd</p>
  20.             <p>asldkfjlaksjdf</p>
  21.         </div>
  22.     </td>
  23.     <td class="der">
  24.         <div class="cont_der">
  25.             <p>adlsfñlkasñdflkasdfñlk </p>
  26.             <p>asdñflñasldkf</p>
  27.             <p>asdñfñlkñlkñlk</p>
  28.         </div>
  29.     </td>
  30.   </tr>
  31.     <tr>
  32.     <td class="izq">
  33.         <div class="cont_izq">
  34.             <p>aklsdflaksjdflkasjdf</p>
  35.             <p>asdlfkjasldkfjasd</p>
  36.             <p>asldkfjlaksjdf</p>
  37.         </div>
  38.     </td>
  39.     <td class="der">
  40.         <div class="cont_der">
  41.             <p>adlsfñlkasñdflkasdfñlk </p>
  42.             <p>asdñflñasldkf</p>
  43.             <p>asdñfñlkñlkñlk</p>
  44.         </div>
  45.     </td>
  46.   </tr>
  47. </body>
  48. </html>

habría que jugar un poquito más con los numeros para que cuadre bien y optimizarlo.
__________________
WFC
codigo82

Etiquetas: dar, linea, longitud
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 19:53.