inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

면접과 취업을 부르는 '퍼블리셔 개인 포트폴리오 홈페이지' 제작

[Coding Mission 01] 인접선택자와 속성선택자를 활용한 순수 CSS 탭 콘텐츠

input태그를 div로 묶어서 작성하면 탭메뉴 구동이 안되나요?

420

서가은

작성한 질문수 4

2

html,css 모두 정답과 똑같이 했는데 

input태그 3개를 div로 묶으니까 아예 이미지도 안뜨고 도트 색깔도 안 바뀌더라구요. div로 묶은거 풀으니까 바로 정상적으로 실행되구요... 이유가 뭔지 궁금합니다 ㅠㅠ

포트폴리오 HTML/CSS jquery

답변 1

0

코딩웍스(Coding Works)

코드를 봐야 하겠지만 만약 inpu t태그를 div로 묶었다면 작동하지 않습니다.

input을 이용한 인접형제선택자는 위로는 선택 불가능입니다. 곧 div로 input을 묶었다면 아래 구조로 되어 있을거에요. 그렇다면 input들을 맨 위로 div없이 위치시켜야 합니다.

<div class="tab-inner">

<div>

<input type="radio" name="tabmenu" id="tab1" checked>

<input type="radio" name="tabmenu" id="tab2">

<input type="radio" name="tabmenu" id="tab3">

</div>

</div>

아래에 있는 것처럼 input을 맨위로 올리세요.

<div class="tab-inner">

<input type="radio" name="tabmenu" id="tab1" checked>

<input type="radio" name="tabmenu" id="tab2">

<input type="radio" name="tabmenu" id="tab3">

</div>

0

서가은

감사합니다. 드뎌 이해했습니다. ㅎ!

현재도 float 사용은 중요한가요?

1

213

2

웹 호스팅 후 문제

1

240

1

퍼블리셔 코딩테스트 질문입니다.

1

587

1

feather light

1

252

2

skill 섹션 질문

1

256

1

포트폴리오 홈페이지 제작가이드

2

250

1

iframe 질문입니다.

1

211

1

디자인설정

1

333

1

연봉 질문합니다.

1

898

1

폰트, 이미지? 관련 질문입니다

1

311

1

파일질라 카페24? 관련 질문입니다

1

433

1

면접 복장 질문입니다

1

747

1

도메인 연결 오류

1

361

1

개인 포트폴리오 웹사이트 안에 들어갈 포트폴리오 웹사이트 작업물들

1

486

1

카페24 절약형 관련 질문있습니다

1

871

2

기능정의서 html에 첨부하는 방법/header include

1

628

1

prototype 뜻

1

704

1

폴더구조 질문드립니다.<재업로드>

1

430

1

폴더구조 질문드립니다

1

360

1

개인포토폴리오 해상도문제요..!

1

391

1

구글에 검색했을 때 나오는 포트폴리오

2

412

1

wow.js live option

1

440

1

개인 포트폴리오 홈페이지 만들때 UI 포토샵 디자인

1

532

1

featherlight 연결시 링크된 html이 문제가 있어요 ㅠㅠ

1

313

1