2013-05-30 4 views
0

세 개의 플로팅 div를 가로로 정렬하려고 시도하는데 어떤 이유로 두 번째와 세 번째 div에서 상승합니다. 이 세 가지 모두를 인라인으로 유지하려고합니다.div를 가로로 정렬합니다.

어떤 아이디어

주요 사업부 내부
<style type="text/css"> 
#main { 
vertical-align: middle; 
alignment-adjust: middle; 
} 
.floater { 
    float:left; 
} 
</style> 
</head> 

<body> 
<div id="main"> 
<div class="floater"><select name="test"></select> 
</div> 
<div class="floater"><select name="test"></select> 
</div> 
<div class="floater"><select name="test"></select> 
</div> 

</div> 
+0

잘 작동하는 것 같다은? [jsFiddle] (http://jsfiddle.net/6Remc/1/) –

답변

0

는 단일 행 3 개 세포 테이블을 추가합니다. 개별 div를 각각의 셀 안에 배치하십시오.

1

코드는 작동하는 것 같군,하지만 여기 그 일을하는 또 다른 방법입니다 :

<style type="text/css"> 
    .floater { 
     display:inline; 
    } 
    </style> 

    </head> 

    <body> 
    <div id="main"> 
    <div class="floater"><select name="test"></select> 
    </div> 
    <div class="floater"><select name="test"></select> 
    </div> 
    <div class="floater"><select name="test"></select> 
    </div> 

    </div> 

예 : JSFIDDLE

+0

추가 CSS와 관련이있을 수 있습니다. 나는 dreamweaver를 통해이 코드를 실행했으며 초기 코드가 제대로 작동합니다. 그러나 작업 광선에 부딪 쳤고 계단 단계와 같은 추가 작업 영역을 이동시킵니다. 나는 그것을 중요하게 무시할 필요가있다. – ICW

+0

작업 영역 구성 문제 일 수 있으므로 다른 편집자가 CSS 스타일이 맞는지 확인하십시오. – konnection

관련 문제