• 카테고리

    질문 & 답변
  • 세부 분야

    자격증 (디자인)

  • 해결 여부

    미해결

position 질문

24.06.09 11:14 작성 24.06.09 11:18 수정 조회수 65

0

header h1{width: 200px; height: 40px; margin: 30px 0;}
header .gnb {width: 180px; height: 200px; margin: 0 auto; background: #0660da;}
header .gnb li{height: 50px; line-height: 50px; text-align: center; font-size: 20px;}
header .gnb li .lnb{width: 0px; position: absolute; transition: 0.3s; height: 50px; background: rgba(0,188,228,0.9); left: 190px; top: 100px; overflow: hidden; z-index: 10;}
header .gnb li:hover{background: #0c4ba0;}
header .gnb li a{color: #fff; display: block;}
header .gnb:hover li .lnb{width: calc(100% - 190px); }

header .gnb li .lnb li{float: left; font-size: 18px;}
header .gnb li .lnb li a{padding: 0 20px;}
header .gnb li:nth-child(2) .lnb{top: 150px;}
header .gnb li:nth-child(3) .lnb{top: 200px;}
header .gnb li:nth-child(4) .lnb{top: 250px;}

position relative는 안적었는데 그럼 부모기준으로 .gnb li가 부모로 자동지정되는건가요? 참고로 D3 유형입니다.

답변 1

답변을 작성해보세요.

0

아니에요 어차피 .lnb 의 크기가 화면꽉차는 크기라서 body를 기준이 되도록 .gnb li에 position을 안준거에요~~ ^^

채널톡 아이콘