개발자의 삶/Web(html, script, css) 기초

[CSS] div 태그 안에 2개 태그 좌/우 정렬과 text 세로 정렬하기

나RD 2015. 8. 4. 17:43
728x90

이것 때문에 무지하게 찾았네.


아무리 해도 텍스트가 세로 정렬이 되지 않아서 왜 안되나.... 안 되나...



위와 같이 div 태그 안에 텍스트 영역과 select box 영역으로 구분하여 한 줄로 표시할 수 있도록 하고 싶었다.


근데 안쪽 div 태그에 열심히 float 으로 left 와 right 를 나누어 주어도 'TEXT' div 영역은 세로 정렬이 되지 않는 것이었다.


아.... 무엇이 문제일까.... 첫번째 div 에서 vertical-align 속성을 분명 middle 로 주었는데 말이다.


흠.... 해답은 여기에서 찾을 수 있었다.


<div style="vertical-align:middle; line-height:35px; height:35px;">

<div style="float:left;">

TEXT

</div>

<!-- select 박스는 css 가 height가 35px 이었다. -->

<select style="float:right;">

...

</select>

</div>



아.... 해답은 찾았는데, 영어가 약해서 해석이 안된다. 젠장..............


일단은 해결인 걸로.....


끝!!

반응형