드롭다운 메뉴 li 태그가 ul 범위를 넘어가는 문제 (CSS)

드롭다운 메뉴 li 태그가 ul 범위를 넘어가는 문제 (CSS)

QA

드롭다운 메뉴 li 태그가 ul 범위를 넘어가는 문제 (CSS)

본문

디자이너가 아니다보니, 간단한것같은데 뭐라 검색해야할지조차 감이 오질 않네요.

딱 보시면 뭐가 문제인지 아실것같습니다.

2943481293_1645496034.0451.png

쇼핑몰 메뉴 설정을 많이 설정을 했더니 범위를 넘어가버리네요. 저는 당연히 가로로 넘어갈줄 알았거든요.

결론적으로 만들고 싶은건 요런모양인데 (hover 되었을때, 세로로 넘어가는 부분들은 가로로 넘어가게... )

2943481293_1645496343.6145.png

그런데 이게 다른 사이트들을 참조하려고해도 hover된 상태에서만 CSS가 노출되는데, DevTool에서 hover나 active 설정해도... 뜨질 않네요...

HTML을 확인해보면 저 칸자체가 ul로만 구성되어있고 따로 감싸고 있는 div 태그 같은것들은 없더라구요. 그러면 ul 태그만 손봐주면 될거다 싶어서 width 값이나 height 값을 고쳐보고 있는데 왜 넘어가는지는 도무지 모르겠습니다.

2943481293_1645496542.8425.png

이 질문에 댓글 쓰기 :

답변 2

아래 이미지처럼 하고 싶으신거 같은데

url좀 알려주실수있나요??

1794632930_1645503818.9696.png

부트스트랩 쓰시는거같은데

css 프로퍼티 값에 따라 방법이 달라지니

url 공유가 어려우시면

ul div 으로 감싸고 아래 처럼 한번해보세요


<div style="width:100%">
    <ul style="width:100%">
            <li style="float:left; width:200px;"></li>
    </ul>
</div>

 

 

 

이런 문제들은 대부분 간단합니다.

감싸는 ul이상의 요소에서 height 크기가 정해져있어서 입니다.

해당 부분을 찾아서 height값을 auto로 바꿔주면 됩니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 113
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT