다른 부분의 왼쪽에 각도 요소를 가져올 수 없습니다.

Question

간단한 질문이지만 힘든 답변 일 수 있습니다. 여러 구성 요소가있는 Angular 5 앱을 만들고 있습니다. 바로 ...

ChartPicker 모두 아주 쉽게

<div> 
    <span> 
     <select [(ngModel)]="config.granularity.selected"> 
     <option [selected]="false" *ngFor="let option of config.granularity.available" [ngValue]="option"> 
      <span class="option-txt"> {{option}} </span> 
     </option> 
     </select> 
    </span> 
</div> 

<div> 
    <span> 
    <div class="btn-group btn-group-small" *ngIf="available_charts.chart_types.length > 1"> 
     <label *ngFor="let type_key of available_charts.chart_types" class="btn btn-default active" [class]="type_key.name == available_charts.chart_types.selected ? 'active' : ''" (click)="available_charts.selected = type_key.name"> 
      <i class="fa fa-bar-chart" aria-hidden="true"></i> 
     </label> 
    </div> 
    </span> 
</div> 

GranularityPicker : 다음은 그 중 두 가지? 글쎄, 난 페이지 왼쪽에 위치한 다른 구성 요소라는 세그먼트,이 같은 응용 프로그램에 넣어 :

<segments [config]="config"></segments> 
<chart-picker [config]="config" class="chart-picker"></chart-picker> 
<granularity [config]="config" class="granularity-picker"></granularity> 

차트 피커가 세분화하기 전에, 그리고 두 클래스의 CSS는 약간의 여유를 가지고 오른쪽, 그리고 부유물 : 오른쪽.

... 차트 선택 도구 인 첫 번째 요소 인 이 마지막 부분에 하나의 오른쪽에 나타납니다.

이것은 전혀 의미가 없습니다. 그리고 CSS를 변경하려고하는 것은 중요하지 않습니다. 그냥 작동하지 않습니다. 이 문제를 해결하는 방법에 대한 아이디어가 있습니까?

Answer 1

두 요소 모두 float:right입니다. 부동 소수점은 문서 순서로 계산되므로 첫 번째 요소는 오른쪽으로 끝까지 이동 한 다음 두 번째 요소는 첫 번째 요소 옆에 떠서 잘못된 순서로 남겨 둡니다. 여기에 float 대신 인라인 또는 인라인 블록 요소를 사용하고 싶을 수도 있습니다. 당신은 완전히 맞아

.r {float:right}

<div class="r">First</div> 
 
<div class="r">Second</div>