드롭 다운의 중앙 폼 부트 스트랩?

부트 스트랩이 드롭 다운되어 있지만 그 안에있는 양식을 가운데에 배치하는 방법을 모르겠습니다.드롭 다운의 중앙 폼 부트 스트랩?

내 코드는 다음과 같습니다.

<div class="navbar navbar-fixed-top"> 
    <div class="navbar-inner"> 
    <div class="container"> 
     <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </a> 
     <a class="brand" href="#">Testing, 123</a> 
     <div class="nav-collapse"> 
     <ul class="nav"> 
      <li class="active"><a href="#"><i class="icon-home icon-white"></i> Home</a></li> 
      <li><a href="#">Link</a></li> 
      <li><a href="#">Link</a></li> 
      <li><a href="#">Link</a></li> 
      <li class="dropdown"> 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a> 
      <div class="dropdown-menu"> 
       <form accept-charset="UTF-8" action="/sessions" method="post"> 
       <fieldset class='textbox login'> 
        <label id='js-username'> 
        <span>Username</span> 
        <input autocomplete="on" id="username" name="username" type="text" size="20px"/> 
        </label> 
        <label id='password'> 
        <span>Password</span> 
        <input id="userpassword" name="userpassword" type="password" /> 
        </label> 
       </fieldset> 
       <fieldset class='subchk'> 
        <input name="commit" type="submit" value="Log In" /> 
       </fieldset> 
       </form> 
      </div> 
      </li> 
     </ul> 
     <form class="navbar-search pull-right" action=""> 
      <input type="text" class="search-query span2" placeholder="Search"> 
     </form> 
     </div><!-- /.nav-collapse --> 
    </div><!-- /.container --> 
    </div><!-- /.navbar-inner --> 
</div><!-- /.navbar -->

나는 내 양식에 맞게 CSS의 드롭 다운의 폭을 조정, 나는 그냥 드롭 다운에서 양식을 중심으로하는 방법을 작동하지 않을 수 있습니다.

출처

2012-04-09 Jack Wilsdon

난 당신이 무엇을 달성하고자하는 확실하지 않다 ..이 질문은 내가 대답 할 때까지 얼마나 오래된 몰랐어요. 그러나 form 태그에 class = "span3"을 추가하십시오. – Altrim

가 그냥 몇 가지 패딩 클래스를 만들고과 같이, 양식 태그에 추가 당신에게 도움이 될 수 있습니다

CSS

.wrap { 
    padding:15px; 
}

HTML

<form class="wrap" accept-charset="UTF-8" action="/sessions" method="post">...</form>

데모 : http://jsfiddle.net/a52UY/는이 작동하는지 확실히 말할 어렵다 당신의 CSS를 보지 않고

출처

2012-04-09 21:55:43

어쩌구, 이것은 끔찍한 대답이다. 이것은 센터링이 아니라 패딩을 추가합니다. – umassthrower

@umassthrower 폼이 가운데에 놓이기 전에 패딩을 사용하여 이전과 같이 컨테이너를 확장 할 수 있습니다. 얼마나 많은 센터가 될 수 있습니까? –

사용 센터 태그는

<center> </center> 


    <div class="dropdown-menu"> 
     <center> 
      <form accept-charset="UTF-8" action="/sessions" method="post"> 

     ....... 

      </form> 
     </center>

출처

2012-04-09 17:00:32 srini

도 끔찍한 대답 – umassthrower

하지만이 시도 :

.dropdown-menu form { 
width: *insert form width here in pixels*; 
margin: 0 auto; 
}

를이 답변은 클래스 드롭 다운과 함께 리튬이 더 큰 것으로 가정 귀하의 양식보다 수평 적으로, 당신은 그 안에 양식을 중심에 놓으려고합니다. 이 메소드를 사용하여 무언가를 수평으로 가운데에 배치하려면 고정 너비가 있어야하며 너비는 부모 요소보다 작아야합니다 (이 경우 클래스 드롭 다운이있는 li). 추가

편집 : 나는

출처

2013-05-25 18:48:07 Kristy

드롭 다운의 중앙 폼 부트 스트랩?

답변

관련 문제