인프런 커뮤니티 질문&답변

Jennifer oh님의 프로필 이미지

작성한 질문수

실전! 웹사이트제작! Step by Step! ('라한호텔' 사이트제작_Application Course)

news_notice 영역_02

span에 display: block줘서 text-align: right 된 부분 문의드려요

21.07.23 11:37 작성

·

735

0

안녕하세요 쌤, 몇가지 문의드려요.

.notice_list{width: 90%; float: left; padding-top: 98px; overflow: hidden;}
.notice_list ul{}
.notice_list ul li{float: left; width: 33.3333%;padding-right: 50px; box-sizing: border-box; }
.notice_list .data{display: block; text-align: right;}

.data가 span인데 text-align: right이 되려면 블럭요소가 되어야하는게 맞나요? 보통은 부모한테 주면 인라인 자식들이 움직이던데 이부분은 자식이다 적용되면 안되니까 .data만 오른쪽으로 보내려는데 블락요소도 text-align이 되나해서요.

그리고 overflow: hidden을 플롯한 자식의 부모에 주는데 header파트에서 부모에게 안줘도 아무일이 없던데 그런경우도 있는건가요? 그리고 하도 줄상황이 많으니까 cf클래서를 만들어서 부모마다 다 붙이는것도 봤는게 그렇게 하는게 일반적인가요?

감사드립니다~ 초보라 계속 헷갈리는 부분이 많네요.ㅜㅜ 

답변 1

1

J.영님의 프로필 이미지
J.영
지식공유자

2021. 07. 24. 10:07

Jennifer oh님 안녕하세요?

span은 인라인요소이기때문에 block요소로 속성을 바꾸게 되면 text-align: right가 적용됩니다. block요소는 한줄을 꽉 채우는 속성이기때문에 그 안에서 정렬이 되는거지요~~
그리고 header에 부모한테 안주는 이유는 height를 설정해놨기 때문에 자체적으로 높이가 지정되어 있어서 자식요소한테 float를 준다해도 높이값이 상실되지 않습니다~~~

열심히 학습하시는 모습 보기 좋습니다^^
언제든 공부하시면서 궁금하신점 있으면 질문주세요~~
오늘도 좋은하루 되시구요^^

J.young드림

Jennifer oh님의 프로필 이미지
Jennifer oh
질문자

2021. 07. 24. 12:00

쌤 답변 넘 감사합니다~ 수고하세용 열공~^^