2

Hola estoy tratando de poner un div, como se el tamaño o el ancho es de 12, lo que quiero es poner 2 div de tamaño 6 cada uno, no estoy familiarizado con el diseño por eso uso bootstrap, el div que quiero descoponer es el segundo si bien vemos una leyenda de colores lo quiero agrupar en 2 partes o 2 divuna de profesores y otra de almnos espero me ayuden : introducir la descripción de la imagen aquí

Este es el cosigo del segundo div

<div class="box box-solid box-primary">
                <div class="box-header with-border">
                    <i class="fa fa-th"></i>
                    <h3 class="box-title">ASISTENCIA POR FECHA &nbsp;&nbsp;[&nbsp;<i class="fa fa-calendar-minus-o"></i> Fecha : <span id="fecha_adjudicacion"><?php echo date('Y-m-d'); ?></span>&nbsp;]</h3>
                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                        <button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
                    </div>
                </div>
                <div class="box-body border-radius-none">
                    <div col-xs-6>
                        <div class="text-center col-sm-2 col-xs-2">
                            <div class="description-block border-right">
                                <h5 class="description-header" ><span style="font-size:15px" class="label label-success" id="total_docentes">97% - 100%</span></h5>
                                <br>
                                <span class="description-text">SEMAFORO DOCENTE</span>
                            </div><!-- /.description-block -->
                        </div><!-- /.col -->
                        <div class="text-center col-sm-2 col-xs-2">
                            <div class="description-block border-right">
                                <h5 class="description-header" ><span style="font-size:15px" class="label label-warning" id="docentes_faltan">90% - 96%</span></h5>
                                <br>
                                <span class="description-text">SEMAFORO DOCENTE</span>
                            </div><!-- /.description-block -->
                        </div><!-- /.col -->
                        <div class="text-center col-sm-2 col-xs-2">
                            <div class="description-block border-right">
                                <h5 class="description-header" ><span style="font-size:15px" class="label label-danger" id="total_alumnos">0% - 95%</span></h5>
                                <br>
                                <span class="description-text">SEMAFORO DOCENTE</span>
                            </div><!-- /.description-block -->
                        </div>
                    </div>
                    <div  col-xs-6>
                        <div class="text-center col-sm-2 col-xs-2">
                            <div class="description-block border-right">
                                <h5 class="description-header" ><span style="font-size:15px" class="label label-success" id="total_docentes">98% - 100%</span></h5>
                                <br>
                                <span class="description-text">SEMAFORO ALUMNO</span>
                            </div><!-- /.description-block -->
                        </div><!-- /.col -->
                        <div class="text-center col-sm-2 col-xs-2">
                            <div class="description-block border-right">
                                <h5 class="description-header" ><span style="font-size:15px" class="label label-warning" id="docentes_faltan">94% - 97%</span></h5>
                                <br>
                                <span class="description-text">SEMAFORO ALUMNO</span>
                            </div><!-- /.description-block -->
                        </div><!-- /.col -->
                        <div class="text-center col-sm-2 col-xs-2">
                            <div class="description-block border-right">
                                <h5 class="description-header" ><span style="font-size:15px" class="label label-danger" id="total_alumnos">0% - 93%</span></h5>
                                <br>
                                <span class="description-text">SEMAFORO ALUMNO</span>
                            </div><!-- /.description-block -->
                        </div>
                    </div>
                </div>
            </div>
2
  • 1
    Los divs internos le aplicas un atributo inexistente <div col-xs-6 > , debería ser <div class="col-xs-6">
    – Dev. Joel
    Commented el 19 may. 2017 a las 19:33
  • Edite la imagen Commented el 19 may. 2017 a las 20:28

1 respuesta 1

0

No estas dándoles una clase a los divs.

Hiciste esto: <div col-xs-6>

Debería ser : <div class="col-xs-6">

Te dejo tu código corregido:

<div class="box box-solid box-primary">
  <div class="box-header with-border">
    <i class="fa fa-th"></i>
    <h3 class="box-title">ASISTENCIA POR FECHA &nbsp;&nbsp;[&nbsp;<i class="fa fa-calendar-minus-o"></i> Fecha : <span id="fecha_adjudicacion"><?php echo date('Y-m-d'); ?></span>&nbsp;]</h3>
    <div class="box-tools pull-right">
      <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
      <button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
    </div>
  </div>
  <div class="box-body border-radius-none">
    <div class="col-xs-6">
      <div class="text-center col-sm-2 col-xs-2">
        <div class="description-block border-right">
          <h5 class="description-header" ><span style="font-size:15px" class="label label-success" id="total_docentes">97% - 100%</span></h5>
          <br>
          <span class="description-text">SEMAFORO DOCENTE</span>
        </div><!-- /.description-block -->
      </div><!-- /.col -->
      <div class="text-center col-sm-2 col-xs-2">
        <div class="description-block border-right">
          <h5 class="description-header" ><span style="font-size:15px" class="label label-warning" id="docentes_faltan">90% - 96%</span></h5>
          <br>
          <span class="description-text">SEMAFORO DOCENTE</span>
        </div><!-- /.description-block -->
      </div><!-- /.col -->
      <div class="text-center col-sm-2 col-xs-2">
        <div class="description-block border-right">
          <h5 class="description-header" ><span style="font-size:15px" class="label label-danger" id="total_alumnos">0% - 95%</span></h5>
          <br>
          <span class="description-text">SEMAFORO DOCENTE</span>
        </div><!-- /.description-block -->
      </div>
    </div>
    <div  class="col-xs-6">
      <div class="text-center col-sm-2 col-xs-2">
        <div class="description-block border-right">
          <h5 class="description-header" ><span style="font-size:15px" class="label label-success" id="total_docentes">98% - 100%</span></h5>
          <br>
          <span class="description-text">SEMAFORO ALUMNO</span>
        </div><!-- /.description-block -->
      </div><!-- /.col -->
      <div class="text-center col-sm-2 col-xs-2">
        <div class="description-block border-right">
          <h5 class="description-header" ><span style="font-size:15px" class="label label-warning" id="docentes_faltan">94% - 97%</span></h5>
          <br>
          <span class="description-text">SEMAFORO ALUMNO</span>
        </div><!-- /.description-block -->
      </div><!-- /.col -->
      <div class="text-center col-sm-2 col-xs-2">
        <div class="description-block border-right">
          <h5 class="description-header" ><span style="font-size:15px" class="label label-danger" id="total_alumnos">0% - 93%</span></h5>
          <br>
          <span class="description-text">SEMAFORO ALUMNO</span>
        </div><!-- /.description-block -->
      </div>
    </div>
  </div>
</div>

1
  • Necesito que el div primary se divida en 2 Commented el 19 may. 2017 a las 20:25

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.