Tengo un problema con esta barra de navegación de arranque. Quiero que cuando se haga clic en el botón, se muestre el contenido (Contenido contraído) pero no en el ancho como lo es en la barra de navegación (ancho completo), sino en el ancho real. Si alguien tiene alguna sugerencia de como hacerlo?
<div class="pos-ft"> <div class="collapse" id="navbarToggleExternalContent"> <div class="bg-dark p-4"> <h4 class="text-white">Collapsed content</h4> <span class="text-muted">Toggleable via the navbar brand.</span> </div> </div> <nav class="navbar navbar-dark bg-dark"> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarToggleExternalContent" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> </nav> </div>Puede agregar una clase de ancho de ajuste a su sección plegable con estilo de contenido de ajuste.
<div class="pos-ft"> <div class="collapse fit-width" id="navbarToggleExternalContent"> <div class="bg-dark p-4"> <h4 class="text-white">Collapsed content</h4> <span class="text-muted">Toggleable via the navbar brand.</span> </div> </div> <nav class="navbar navbar-dark bg-dark"> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarToggleExternalContent" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> </nav> </div>El estilo css:
.fit-width { width: fit-content; }** Si necesita cambiar el tamaño de toda la barra de navegación, puede colocar la clase en el div superior al lado de la clase pos-ft.