Ver Mensaje Individual
  #1 (permalink)  
Antiguo 20/10/2012, 00:06
maczy
 
Fecha de Ingreso: noviembre-2011
Mensajes: 69
Antigüedad: 13 años
Puntos: 0
Exclamación [CSS imput - radio - checkbox ]- redefinir

Hola a todos como estan? estoy teniendo problema con un CSS y quisiera una manito si alguien puede, las cosa es asi:

Estoy haciendo una pagina para una encuesta, es un recabado de datos importante con muchas planillas, bien, lo que sucede es que tiene buena interfaz para cuando son pocos INPUT de entrada, pero cuando quiero hacer varios juntos en una misma linea es donde no se como hacerlo para que solo tome eso y no la propiedad de los demas INPUT el mismo caso para checkbox y radio.

Se entendio?

Aca dejo un ejemplo de formulario y el css

Código HTML:
Ver original
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.     <head>
  4.         <title>.:: Formulario 3 ::.</title>
  5.         <link rel="shortcut icon" href="images/favicon.png" type="image/x-icon"/>      
  6.         <link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
  7.         <script type="text/javascript" src="js/jquery.min.js"></script>
  8.         <script type="text/javascript" src="js/sliding.form.js"></script>
  9.        
  10.          <script language="javascript" type="text/javascript" src="js/validaciones.js"></script>
  11.          <script type="text/javascript" language="javascript" src="js/funciones.js"></script>
  12.     </head>
  13.    
  14.     <style>
  15.         span.reference{
  16.             position:fixed;
  17.             left:5px;
  18.             top:5px;
  19.             font-size:10px;
  20.             text-shadow:1px 1px 1px #fff;
  21.         }
  22.         span.reference a{
  23.             color:#555;
  24.             text-decoration:none;
  25.             text-transform:uppercase;
  26.         }
  27.         span.reference a:hover{
  28.             color:#000;
  29.            
  30.         }
  31.         h1{
  32.     color: #090;
  33.     font-size: 36px;
  34.     text-shadow: 1px 1px 1px #fff;
  35.     padding: 20px;
  36.         }
  37.     </style>
  38.    
  39.     <body>        
  40.         <div id="content">
  41.             <h1><img src="images/logo2.png" width="80" height="95"> Subsecretaria de Turismo</h1>
  42.             <div id="wrapper">            
  43.               <div id="steps">
  44.                     <form id="formElem" name="form" action="" method="post">
  45.                    
  46.                         <fieldset class="step"><legend>Tenencia</legend>
  47.                        
  48.                         <p>
  49.                           <label>Tipo de Tenencia</label>
  50.                           <select name="est_ten">
  51.                           <option value="pepe">Seleccione una opcion</option>
  52.                           <option>Propio</option>
  53.                           <option>Concesión</option>
  54.                           <option>Alquilado</option>
  55.                           <option>Otro</option>
  56.                           </select>
  57.                           </p>
  58.                           <p>
  59.                           <label>Tipo de Cargo</label>
  60.                           <select name="est_carg">
  61.                           <option value="">Seleccione una opcion</option>
  62.                           <option>Propietario</option>
  63.                           <option>Gerente/encargado</option>
  64.                           <option>Concesionario</option>
  65.                           <option>Administrador</option>
  66.                           </select>
  67.                           </p>
  68.                           <p>
  69.                           <label>Nombre </label>
  70.                           <input name="ten_nom" type="text">
  71.                           </p>
  72.                           <p>
  73.                           <label>Apellido</label>
  74.                           <input name="ten_ape" type="text">
  75.                           </p>
  76.                           </fieldset>
  77.                          
  78.                          
  79.                           <fieldset class="step">
  80.                           <legend>Tenencia</legend>
  81.                           <p>
  82.                           <label>Telefono 1</label>
  83.                           <input name="ten_tel1" type="text">
  84.                           </p>
  85.                           <p>
  86.                           <label>Telefono 2</label>
  87.                           <input name="ten_tel2" type="text">
  88.                           </p>
  89.                           <p>
  90.                           <label>Celular</label>
  91.                           <input name="ten_cel" type="text">
  92.                           </p>
  93.                           <p>
  94.                           <label>E-Mail</label>
  95.                           <input name="ten_mail" type="text">
  96.                           </p>                        
  97.                         </fieldset>
  98.                        
  99.                    
  100.                    
  101.                        
  102.                       <fieldset class="step">
  103.                             <legend>Confirmar</legend>
  104.                             <p> Asegurese de haber llenado correctamente todos los campos.<br/>Si esta seguro/a presione continuar para guardar los datos y pasar a la siguiente planilla.
  105.                             </p>                    
  106.                             <p class="submit">
  107.                             <button id="registerButton" type="submit">Continuar</button>
  108.                             </p>
  109.                             <input type="hidden" name="grabar" value="si" />
  110.                         </fieldset>
  111.                     </form>
  112.                 </div>
  113.                
  114.                
  115.                
  116.                
  117.                 <div id="navigation" style="display:none;">
  118.                     <ul>
  119.                         <li class="selected">
  120.                             <a href="#">Paso 1</a>
  121.                         </li>
  122.                         <li>
  123.                             <a href="#">Paso 2</a>
  124.                         </li>
  125.                         <li>
  126.                             <a href="#">Paso 3</a>
  127.                         </li>                      
  128.                                                
  129.                     </ul>
  130.                 </div>
  131.             </div>
  132.         </div>
  133.     </body>
  134. </html>