inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

반응형 웹사이트 포트폴리오(Architecture Agency)

PC 레이아웃 섹션 상세 퍼블리싱(Location Section) - #01

질문입니다.

해결된 질문

130

웹개바르르

작성한 질문수 23

1

.feature > div 에  float: left; 를 주면

.feature이 높이값을 잃어서 overflow: hidden;  을 줘야하는거 아닌가요? 영상에서는 높이값을 잃지 않았네요..? 이유가 뭔가요??   

jquery HTML/CSS 웹 디자인 반응형-웹

답변 1

2

코딩웍스(Coding Works)

html 요소는 포지션 속성 중 absolute 또는 fixed를 주면 자동으로 inline-block으로 디스플레이 속성이 변경됩니다.

그래서  .feature > div 에  float: left 를 주어도 부모요소인 .feature가 높이 값을 잃지 않습니다. relative에서는 부모요소가 높이값을 잃습니다. 이건 기술적으로 정확히 왜 그런지 설명 드리기가 어렵습니다. 지금 당장 생각이 나지 않네요. 이론적인 설명은 제가 찾으면 다시 글 올릴게요. 일단 이런 경우 곧, 포지션 속성 중 absolute 또는 fixed를 주면 인라인블록으로 바뀌므로 높이값을 따로 줄 필요가 없다라고 생각하세요.

아래 코드로 연습해보시면 이해가 더 쉬우실거에요.

<style>
    .feature {
      border: 5px solid #000;
      width: 600px;
      position: absolute;
    }
    .feature > div {
      border: 5px solid red;
      float: left;
      width: 250px;
      height: 100px;
    }
  </style>

<section class="feature">
    <div class="office">office</div>
    <div class="service">service</div>
  </section>

full reload 질문

1

180

3

섹션4에 있는 4번째 강의 질문(스크롤링)

1

149

2

안녕하세요. 질문있어서 조심스레 글을 올려봅니다.

1

197

1

브라켓 라이브 실행시 실행오류때문에 진도가안나갑니다..ㅠㅠ

1

317

3

css full reload 문제가 발생하여 질문드립니다!

1

315

3

파일 내 index.html에 대한 오류

1

264

1

모바일 네비게이션 퍼블리싱 - 모바일트리거, GNB 보이기 감추기 부분 해결되지 않아 재 질문 드립니다ㅠㅠ

1

207

1

모바일 네비게이션 퍼블리싱 - 모바일트리거, GNB 보이기 감추기 질문입니다

0

218

2

모바일 네비게이션 퍼블리싱 ㅡ모바일트리거,GNB 보이기 감추기 부분 다시 수정하여 질문드립니다!

1

201

2

모바일 네비게이션 퍼블리싱 ㅡ모바일트리거,GNB 보이기 감추기 부분 질문드립니다.

1

255

3

크로스브라우징-크롬

1

280

2

섹션 17 하드코딩으로 이미지맵 만들기 부분 연습파일이 없어요..

0

256

1

line-hieght를 em 단위로 쓰는 것에 대하여 질문 드립니다

1

217

1

슬릭 슬라이더 dots 보이게 하는 방법 질문 드립니다

1

274

1

이거 h2 가 안나오고 스크롤도 안되는데 왜이래요?

1

257

1

모바일 버전에서 메뉴 클릭 후 그 위치로 이동할 때 상단 영역

1

508

2

PC에서 모바일화면으로 전환되면 GNB 메뉴가 OPEN되어있는 상태 (소스)4

2

233

1

PC에서 모바일화면으로 전환되면 GNB 메뉴가 OPEN되어있는 상태 (소스)3

2

308

1

PC에서 모바일화면으로 전환되면 GNB 메뉴가 OPEN되어있는 상태 (소스 js)2

2

260

1

PC에서 모바일화면으로 전환되면 GNB 메뉴가 OPEN되어있는 상태

2

423

1

포지션 속성 중복과 관련해서

1

215

1

section about에 관련.. 궁금해요

1

256

1

섹션3 모바일네이게이션 퍼블리싱 모바일트리거 관련

1

194

2

개발자도구

2

483

6