CSS 질문입니다 가운데정렬과 오른쪽정렬

Question

가로 행이 있고 그 안에 두개의 요소가 있습니다.첫 번째요소는 가운데 정렬을, 두번째 요소는 오른쪽 정렬을 해야합니다.

방법이 다양한데 보통 어떤 방법을 쓰나요?absolute로 left:50%, right:50% translate5050 주고 div를 flex 로 주고 child2를 right로 주는건가여???아니면 flex로 설정하고 space-between을 주고, child2를 hidden을 주는방법을 사용하나요?

hidden

킁킁탐정 · Accepted Answer

https://play.tailwindcss.com/aUVvGMvGTC

CENTER

RIGHT

.ml-auto { margin-left: auto; } .flex { display: flex; } .justify-center { justify-content: center; }

스프라이트마시쪙 · Answer

레이아웃 구조에 따라 다양해서 많은 방법이 있지만저같으면div에는 clearfix 처리 하고child1에 text-align:centerchild2에 float: right뭐 그외의 grid 사용하는 방법도 있지만 이방법이 가장 단순할거같네요

고뿌 · Answer

말씀하신 방법중 position 을 건들이는것보단, flex를 쓰는것이 훨씬 세련된 방식이고,다만, 불필요한 div 하나를 추기하기보단 before를 사용하심이 어떤가 싶습니다.https://jsbin.com/maxekopusi/edit?html,css,output

제로밀키스 · Answer

grid를 쓰는게 가장 깔끔한 방법일 것 같아요!아니면 부모요소에 flex를 주고 자식 div 3개 만든다음 basis 1/3씩 갖게 한 후 첫번째 요소는 비우고 두번째 요소에 로고, 세번째에 auth 버튼들 넣으셔도 되겠네용!

CSS 질문입니다 가운데정렬과 오른쪽정렬

4개의 답변

기술 목록