none
Como reducir el ancho de navbar en ASP.NET webform con bootstrap? RRS feed

  • Pregunta

  • Tengo un navbar en mi webform, pero al verlo este ocupa todo el ancho de la pagina, como se puede ver en la imagen.

    Pero quisiera que se muestre de esta forma, el navbar centrado y con un width de 1000 o 900px

    Intente haciéndolo de esta manera, pero no resulta...

    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <link href="Styles/Bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    
        <style type="text/css">
        .navbar-outer {
      width:800px;
        }
            
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
      <div class="navbar-outer">
      <div class="navbar">
       <div class="collapse navbar-collapse  navbar-ex1-collapse">
          <ul class="nav navbar-nav">
             <li class="active"><a href="#">Inicio Contacto</a></li>
             <li><a href="#">Reglamento</a></li>
             <li><a href="#">Documentos</a></li>
          </ul>
      </div>
      </div>
    </div>

    miércoles, 23 de septiembre de 2015 16:12

Respuestas

Todas las respuestas

  • Hola, podrias encerrarlo en un contenedor. De clase Boostrap

    Saludos

    <div class="container">
    <div class="navbar-outer">
      <div class="navbar">
       <div class="collapse navbar-collapse  navbar-ex1-collapse">
          <ul class="nav navbar-nav">
             <li class="active"><a href="#">Inicio Contacto</a></li>
             <li><a href="#">Reglamento</a></li>
             <li><a href="#">Documentos</a></li>
          </ul>
      </div>
      </div>
    </div>
    </div>



    "La vida seria mucho mas sencilla si le pudieramos hechar un ojo a su codigo fuente."

    Humberto De la Rosa
    Front END Design, Web Programmer, Android Developer


    Twitter: @bethofantoche
    Blog: Humberto Apps

    miércoles, 23 de septiembre de 2015 16:14
  • Pero como haria para centrarlo.. porque me sale un poco para la izquierda utilizando el codigo de arriba ... puedo hacerlo dentro del css que he creado?

    

    miércoles, 23 de septiembre de 2015 16:39
  • hola

    y si lo centras usando el sistema grid, definir el div como row y col para poder realizar un offset en caso de querer moverlo

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    miércoles, 23 de septiembre de 2015 16:47