CSS에서 한 줄로 나오는 태그들을 다음 줄에 표시하는 방법이 궁금합니다

Question

위와 같이 한 줄로 표시되는 태그들을 아래처럼 두 줄로 표시하려면 어떻게 해야 할까요?HTML, CSS 코드는 아래와 같습니다.HTML

> 연락처

CSS/* SEARCH BOX */ .search { position: relative; } .search input { float: left; display: inline-block; width: 200px; border: 1px solid #bbb; border-radius: 8px; padding: 10px 12px; margin-right: 10px; margin-bottom: 10px; font-size: 14px; } .search img { position: relative; float: left; width: 17px; top: 10px; margin-left: 5px; } /* TITLE */ .title { box-sizing: content-box; position: relative; font-size: 26px; color: green; float: left; }span 태그를 p나 div로 바꿔보는 것도 시도해봤는데 먹히지 않네요.ㅜㅜCSS를 잘 모르는지라 도움 부탁드립니다!추가) 해결되었습니다.아래와 같이 사이에
태그를 두 번 넣어주니 되네요~

> 연락처

참고로 하나만 넣었을 땐 크기가 안 맞는 건지 아래처럼 깨지더군요. 무튼간에 감사합니다~

강아지좋아하는개발자 · Answer

? 질문의 의도를 정확히 모르겠지만다음 줄에 표시 한다? 라는 것만 충족시킨다면
를 사용해는게 어떠신가요?.title .serach 사이에
넣으시면 되실듯 한데..

nextFastKaggle · Answer

content 로 flex 를 주신것같습니다. 만일 flex 를 안주셨음 flex를주시고 left 는 빼주시는게좋습니다.그러면 아래처럼 각각 div 로 파트를 감싸는게 가독성이 좋아 보입니다.

연락처

https://s3.ap-northeast-2.amazonaws.com/cdn.wecode.co.kr/icon/search.png">

https://studiomeal.com/archives/197위처럼 하는게 훨씬 깔끔할것같습니다 너무대충만든점이있긴하지만.https://wazacs.tistory.com/19다양한 예제로 배우는 CSS 설계 실전 가이드이책보고 공부를 하시는게 좋을것 같습니다. 일본 css 1등 10년이상 한걸로압니다.

CSS에서 한 줄로 나오는 태그들을 다음 줄에 표시하는 방법이 궁금합니다

2개의 답변

기술 목록