Twitter Bootstrap 열이 올바르게 정렬되지 않음

Twitter Bootstrap 열이 올바르게 정렬되지 않음

---

왼쪽에 로그인 정보가 있고 맨 오른쪽에 다른 정보가 있고 오른쪽에 정렬 된 상태로 화면을 가로 질러 행을 만들려고합니다. 이것은 내 실패한 시도입니다.

<div class="container well">
    <div class="row">
        <div class="col-lg-6">
            @(Session["CurrentUserDisplay"] != null ? "Welcome, " + @Session["CurrentUserDisplay"] : "Not logged in")
        </div>
        <div class="col-lg-6 pull-right">Active Portfolio: @(Session["ActivePortfolioName"].ToString()) 
        </div>
    </div>
</div>

그러나 두 번째 열은 행의 중간에 있으므로 '세포'에서 옳지 않은 것 같습니다. 누구든지 저를 올바르게 안내 할 수 있습니까?

---

pull-right 대신 text-right를 사용 하십시오 .

text-right클래스는를 사용하여 해당 요소의 내용을 오른쪽으로 정렬합니다 text-align: right.

pull-right클래스는를 사용하여 요소 자체를 정렬합니다 float:right.

---

오프셋을 사용해야한다고 생각합니다. col-md-offset- * 클래스 추가

더 자세한 내용은 http://getbootstrap.com/css/#grid-offsetting 문서에서 읽을 수 있습니다.

---

pull-right패널 본문에있는 경우 클래스를 배치 할 위치에 대한 작업 예제를 추가하기 만하면 ... 문제는 클래스가 pull-right자동으로 왼쪽 및 오른쪽 여백 ( margin-left:-15px; margin-right:-15px)을 삭제하는 것이므로 래핑하지 않고 요소에 클래스를 추가 할 수 없습니다. A를 row하고 col-lg-12.

후자의 경우 정렬 할 요소의 너비가 (12-n) 열의 전체 너비인지 알 수 없기 때문에 pull-right더 낫다고 생각 col-xx-offset-n합니다.

<div class="panel panel-default">
    <div class="panel-heading">
        This is panel title
    </div>
    <div class="panel-body">
        <div class="row">
            ...
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div class="pull-right">
                    <button ...></button>
                    <button ...></button>
                </div>
            </div>
        </div>
    </div>
</div>

최종 결과는 다음과 같습니다.

+-----------------+
|  panel          |
+-----------------+------------------------------------------------+
|                                                                  |
|  This is panel heading.                                          |
|                                                                  |
+-------------------------------------------------------------------------+
|                                                                  |      |
|  row 1, for form elements.                                       |      |
|                                                                  |      |
|                                                                  |      |
|                                                                  |      +
|                                                                  |   panel-body
|                                                                  |      +
|                                                                  |      |
|                                                                  |      |
|                                                                  |      |
|                                                                  |      |
+----------------------------------------------+---------+---------+      |
|  row 2, only buttons to the right            | button1 | button2 |      |
+----------------------------------------------+---------+---------+------+

참조 URL : https://stackoverflow.com/questions/20854775/twitter-bootstrap-column-not-right-aligning