Comunidad de diseño web y desarrollo en internet online

Radio Buttons bien tabulados!

Citar            
MensajeEscrito el 15 Ene 2010 06:03 pm
Hola!

Estoy desarrollando una aplicación con JSP y en una de las ventanas tengo unos cuantos radio buttons, definidos como

<input type="radio">

El texto de cada radio es más largo que una línea y, por tanto, sale bastante feo por pantalla (Lo podeis ver aquí, que he subido una muestra http://img686.imageshack.us/img686/2972/muestrat.jpg)

Me gustaría que saliese alineado, es decir, que la segunda y sucesivas líneas salieran a la misma altura que empieza el texto de la primera, no sé si me explico.

¿Hay algún atributo que consiga esto? ¿O cómo puedo conseguirlo?

Muchas graciassss

Por keyra

2 de clabLevel



 

msie8
Citar            
MensajeEscrito el 15 Ene 2010 07:15 pm
hazlo con una tabla asi:

Código HTML :

<table>
<tr><td>Texto de 1er radio</td><td><input type="radio"></td> </tr>
<tr><td>Texto de 2do radio</td><td><input type="radio"></td> </tr>
<tr><td>Texto de 3ro radio</td><td><input type="radio"></td> </tr>
<tr><td>Texto de 4t0 radio</td><td><input type="radio"></td> </tr>
</table>

Por jpcw

Claber

1715 de clabLevel

1 tutorial

Genero:Masculino  

AlgoritmicBrainDesigner

firefox
Citar            
MensajeEscrito el 15 Ene 2010 11:30 pm
En caso que pienses que no es información tabulada lo que estás presentando ahí, mira y ajusta a tus necesidades:

Código HTML :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<title>DvillB: Radio-botones</title>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />
<style type="text/css">
* {margin: 0; padding:0; outline: none; border: 0; position: relative;}
* html, * body { height:100%; overflow:auto;}
body {font-family: serif; font-size: 100%; background: #FFF;}
#container {
  margin: 20px 0 0 20px;
  width: 350px;
}
p {
  border-bottom:1px dotted #cdcdcd;
  font-family:monospace;
  font-size:1em;
  margin-bottom:3px;
  overflow: hidden;
}
p input {
  float: left;
  height: 2em;
  margin: -2px 5px 0 0;}
</style>
</head>
<body>
  <div id="container">
      <p><input type="radio" />Texto de un radio-butón que sobrepasa la anchura del div contenedor</p>
      <p><input type="radio" />Texto de otro</p>
      <p><input type="radio" />Radio-botón del item tercer</p>
      <p><input type="radio" />Texto de 1er radio-butón que sobrepasa la anchura</p>
   </div>
</body>
</html>

Es un primer acercamiento y seguramente necesitará algo más, ya que apenas aportas datos concretos, como longitud del texto (máxima y mínima), anchura de la ventana (o caja) donde lo presentas...

Saludos

Por DvillB

118 de clabLevel



 

firefox
Citar            
MensajeEscrito el 28 Ene 2010 08:35 pm
Muchas gracias por el aporte!! Necesitaba solucionarlo rápido, así que metí los tables, pero más adelante es probable que pruebe lo que me dices para que quede más elegante ;)

Por keyra

2 de clabLevel



 

msie8

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.