Tema: ¿Como poner iconos juntos sin usar divs en una tabla html?
Ver Mensaje Individual
  #8 (permalink)  
Antiguo 28/01/2013, 17:09
nedyer
 
Fecha de Ingreso: enero-2011
Mensajes: 94
Antigüedad: 13 años, 10 meses
Puntos: 7
Respuesta: ¿Como poner iconos juntos sin usar divs en una tabla html?
Código CSS: 
Ver original
  1. #tabla
  2. {
  3.     padding: 0px;
  4.     height: 30px;
  5.     width: 839px;
  6.     margin-top: 0px;
  7.     margin-right: auto;
  8.     margin-bottom: 0px;
  9.     margin-left: auto;
  10.     border: 1px solid #C1C1C1;
  11.     background-color: #F9F9F9;
  12.     font-family: Verdana, Geneva, sans-serif;
  13.     font-size: 10px;
  14.     font-weight: bold;
  15.     text-transform: capitalize;
  16.     color: #000000;
  17.     text-align: center;
  18.     -moz-box-shadow: 0px 0px 1px 0px #C0C0C0;
  19.     -webkit-box-shadow: 0px 0px 1px 0px #C0C0C0;
  20.     box-shadow: 0px 0px 1px 0px #C0C0C0;
  21. }
  22.  
  23. .campos
  24. {
  25.     float: left;
  26.     height: 20px;
  27.     width: 125px;
  28.     padding-top: 10px;
  29.     padding-right: 5px;
  30.     padding-left: 5px;
  31.     text-align: center;
  32.     padding-bottom: 0px;
  33.     border-left-width: 1px;
  34.     border-left-style: solid;
  35.     border-left-color: #C1C1C1;
  36. }
  37.  
  38. .bts
  39. {
  40.     padding: 0px;
  41.     float: left;
  42.     height: 30px;
  43.     width: 39px;
  44.     text-align: center;
  45.     border-left-width: 1px;
  46.     border-left-style: solid;
  47.     border-left-color: #C1C1C1;
  48. }
  49.  
  50. .n
  51. {
  52.     float: left;
  53.     height: 20px;
  54.     width: 39px;
  55.     padding-top: 10px;
  56.     padding-right: 0px;
  57.     padding-bottom: 0px;
  58.     padding-left: 0px;
  59. }



Código HTML: 
Ver original
  1. <div id="tabla">
  2.   <div class="n">1</div>
  3.   <div class="campos">nombre</div>
  4.   <div class="campos">apellido</div>
  5.   <div class="campos">asignatura</div>
  6.   <div class="campos">notas</div>
  7.   <div class="campos">algo mas</div>
  8.   <div class="bts"><img src="Imagenes/PNG/Btn_Detalle.png" alt="" name="n1" width="30" height="30" id="n1" /></div>
  9.   <div class="bts"><img src="Imagenes/PNG/Btn_Actualizar.png" alt="" name="n2" width="30" height="30" id="n2" /></div>
  10.   <div class="bts"><img src="Imagenes/PNG/Btn_Eliminar.png" alt="" name="n3" width="30" height="30" id="n3" /></div>
  11. </div>