2014-09-12 4 views
0

이것은 나를 정신적으로 이끌고 있습니다.
내 세 번째 div (content-col-text)가 플로트 오른쪽으로 이동하지 않는 이유는 무엇입니까?
gallery-thumb-container와 정렬되어 있습니까? 오른쪽으로 이동하여 큰 이미지 컨테이너와 정렬해야합니다. 여기가 외부 div 래퍼 (엔트리 컨텐트)입니다.
나는 이상한 여백을 가지고 있습니다.플로트에서 오른쪽 상단 정렬

floating div example

+1

위치를 바꾸지 않는 이유는 무엇입니까? 두 번째에'content-col-text'를 넣는다. – qtgye

+1

내가 할 일은 갤러리 - 엄지 - 컨테이너 div 위의 content-col-text div를 넣는 것 뿐이라고 생각합니다. – Parody

+0

예 - 주문 감사합니다. –

답변

3

주문이 잘못되었습니다. 작동하려면 아래와 같이 변경해야합니다. 다음은

코드입니다 :

html로 :

<div class="large-image-container">&nbsp;</div> 
<div class="content-col-text">&nbsp;</div> 
<div class="gallery-thumb-container">&nbsp;</div> 

CSS의 :

.large-image-container{float:left; width:66%; background:red;} 
.gallery-thumb-container{float:left; width:66%; background:yellow;} 
.content-col-text{float:right; width:31%; background:green;} 

바이올린 데모 :

DEMO

는 당신이 clear:both;를 사용할 때 일반적으로 이러한 상황에서, 수레가 올바르게 수정하고 제대로 작동합니다.

희망이 도움이됩니다.

+0

nop :/그다지 아무것도하지 않는 것처럼 보입니다. –

+0

바이올린을 게시 할 수 있습니까? – Nitesh

+0

주문했습니다. 두 번째 텍스트 입력란이 필요합니다. –

1

당신의 gallery-thumb-container가 왼쪽 수레와 large-image-container의 오른쪽에 더 이상 공간이 없습니다로 아마 아래로 강제하고있다.

당신은 <div> 년대의 순서를 전환 시도와 세 번째

대신 content-col-text초를 넣어 또 다른 옵션은 절대적으로 위치하는 것입니다,하지만 문서의 흐름 밖으로 걸릴 수 있습니다 ...

+0

그래, 괜찮아. 너희들이 옳았 어. 순서는 물론 도움이되었습니다. –

관련 문제