0

Buen dia. Intento acomodar en toda una columna izquierda el menu de botones, y en el apartado derecho muestre el visor de PDF al dar clic los botones. No logro hacer que se acomode todo el menu izquierdo, me queda asi como en la imagen...imagen de como queda

y lo que busco es que quede asi....

introducir la descripción de la imagen aquí

Si me pudieran ayudar a acomodarlo, ya intente de varias maneras. Gracias El codigo es

 <div class="container-fluid">
  <div class="row content">
    <div class="col-xs-2 col-sm-3 col-lg-2 sidenav textarbol" >
<div class="dropdown">
    <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Tutorials
    <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a tabindex="-1" href="#">HTML</a></li>
     
  
    </ul>
  </div>
    </div>
       </div>
  <div class="row content">
    <div class="col-xs-2 col-sm-3 col-lg-2 sidenav" >
  <div class="dropdown">
    <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Tutorials
    <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a tabindex="-1" href="#">HTML</a></li>
           </ul>
  </div>
    </div>
      </div>
<!--CONTENIDO DERECHO -->
  <div class="col-xs-12 col-sm-12 col-lg-10">
     <div class="col-xs-6 col-sm-6 col-lg-12" align="center">
    
 <object data="aa.pdf" type="text/html"  style="width:80%;height:100vh;">
   </object>
      </div>
</div>
  </div>
       

1 respuesta 1

0

Modifique algunas cosas de tu código para que se adapte a lo que necesitabas. adjunto el código

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet"/>
<!DOCTYPE html>
<html>
   <head>
      <title>Object</title>
   </head>
   <body>
      <div class="container">
         <div class="row">
            <div class="col-2">
               <div class="row">
                  <div class="col">
                     <div class="dropdown">
                        <button
                           class="btn btn-default dropdown-toggle"
                           type="button"
                           data-toggle="dropdown"
                        >
                           Tutorials <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu">
                           <li><a tabindex="-1" href="#">HTML</a></li>
                        </ul>
                     </div>
                  </div>
               </div>
               <div class="row">
                  <div class="col">
                     <div class="dropdown">
                        <button
                           class="btn btn-default dropdown-toggle"
                           type="button"
                           data-toggle="dropdown"
                        >
                           Tutorials <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu">
                           <li><a tabindex="-1" href="#">HTML</a></li>
                        </ul>
                     </div>
                  </div>
               </div>
            </div>
            <div class="col-10" align="center">
               <object
                  data="cleancode.pdf"
                  type="text/html"
                  style="width: 80%; height: 100vh;"
               >
               </object>
            </div>
         </div>
      </div>
   </body>
</html>

1
  • Gracias men, me sirvió el codigo que pasaste, de ahi partí en continuar el resto. !! el 23 ago. 2020 a las 21:35

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.