DIV 내의 두 단락이 바뀝니다

안녕하세요! 반응 형 사이트의 DIV (이름 및 직위) 내에 두 단락을 배치하려고합니다. 내가 화면의 크기가 다른 연주를 시작 할 때마다 DIV 내의 두 단락이 바뀝니다

.header { 
 
    min-height: 56px; 
 
    transition: min-height 0.3s; 
 
    max-width: 800px; 
 
} 
 

 
.header__inner { 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    float: left; 
 
    border: 3px solid #73AD21; 
 
    display: inline; 
 
} 
 

 
.header__text { 
 
    float: right; 
 
    border: 3px solid #73AD21; 
 
    display: inline; 
 
}

<header class="header"> 
 
    <div class="header"> 
 
    <div class="header__inner"> 
 
     <img class="header__logo" src="logo.jpg" alt="Logo"> 
 
    </div> 
 
    <div class="header__text"> 
 
     <p class="header__title"> 
 
     NAME 
 
     </p> 
 
     <p class="header__subtitle"> 
 
     CURRENT POSITION 
 
     </p> 
 
    </div> 
 
    </div> 
 
</header>

두 단락은 무작위로 장소를 전환합니다. 그들이 어떻게 잘 지낼 수 있는지 어떻게 확신 할 수 있습니까? 페이지가 Page with misplaced texts

보이는 그리고 이것은 내가 당신이 누구의 위치를 두 요소의 CSS를 게시되지 않은 것 같다

what I want to do

출처

2017-12-04 user2766035

사용 인 flexbox, 그것은 훨씬 쉽게 당신의 인생을 만들 것입니다 (당신은 또한 얻을 : 확인하려면 header__subtitle 충분한 공간이 header__title 경우에도의 왼쪽에 표시되지 않습니다, 당신은이를 추가 할 수 있습니다 플렉스 주문에 보너스가 추가되었습니다. 즉, 모바일 대 데스크톱에서 div의 순서를 변경하는 것과 같은 깔끔한 작업을 수행 할 수 있습니다. – delinear

'두 단락이 무작위로 자리를 바꾼다.'어떻게? 나는 이것을 볼 수 없다. –

"화면의 크기가 서로 다른 것을 시작할 때마다 단락이 무작위로 전환된다". 당신이 진술 한대로 그 효과를 일으킨 크기는 무엇입니까? –

을 달성하고자하는 것을 얼마나

입니다 전환하려면 header__title 및 header__subtitle. 그러나 분명히 그들은 둘 다 옳다. 대신 수레의

.header__subtitle { 
    clear: right; 
}

출처

2017-12-04 16:36:26 Johannes

DIV 내의 두 단락이 바뀝니다

답변

관련 문제