ul태그를 이용한 메뉴에서 li정렬 방식에 대해 어떻게 생각하시나요
수련
2023.04.01
간단하게 제가 아는 방법으로 2가지 방법이 있는데
1. li {float: left; }
2. li {display: inline; }둘다 서로간의 간격차이는 약간 있지만 어쨋든
같은 결과를 불러오는데 실제 있는 사이트들 보면 대부분 float를 많이 쓰던데
이건 그냥 방식의 차이인가요
아니면 서로 장단점이 있는 걸까요
-
큰모듬
코드상으로 display:inline을 사용하면 초큼은 짧게 나올테고. text-align을 ul에 적용하면 원하는 정렬이 쉽게 가능하고 단 img를 사용했다면 white space로 4px 한 칸이 이미지 사이에 벌어지는 부분이 생길 수도 있어요.
float를 사용하면 그 다음에 오는 요소에 float 해제를 해 주어야 하는 부분이 있죠.(위에 이야기한 한 칸이 떨어지는 듯한 버그는 발생하지 않아요) 디자인과 상황에 따라 사용하시면 될 것 같습니다 -
슬아
inline-block ie 하위 버전에서 사용됩니다.
-
거늘
글쎄요~ 거기까진 생각을 해보진 않았지만 여태까지 쓰면서 문제됬던 부분은 없었어요 ^^
-
리나
그건 6,7에서 안 먹지 않나요?
-
뽀야
그렇담 display:inline-block으로 하면 되겠네요
-
트런들
블록 요소와 인라인 요소 padding, margin 값의 차이 아닐까요?
인라인 요소인 span 에서는 padding-top, padding-bottom 안먹히더라구요..
| 번호 | 제 목 | 글쓴이 | 날짜 |
|---|---|---|---|
| 2696263 | 프로그래밍 공부시작 질문 (6) | 진이 | 2025-05-28 |
| 2696206 | SK2의 플래시를 밴치마킹하려고하는데요.. (1) | 비내리던날 | 2025-05-27 |
| 2696179 | ie7에서 사라지지가 않네요. (2) | 빛길 | 2025-05-27 |
| 2696150 | div에 스크롤 생기게 하려면... (2) | 에드가 | 2025-05-27 |
| 2696123 | 자료구조론 공부중인데 | 김자영 | 2025-05-26 |
| 2696094 | exe 파일 | 제철 | 2025-05-26 |
| 2696043 | 제이쿼리 .scroll() 관련 질문드립니다 | 이거이름임 | 2025-05-26 |
| 2695984 | 마크업상으로 하단에 있으나 우선적으로 이미지파일을 다운로드받는 방법 (1) | 들꿈 | 2025-05-25 |
| 2695934 | tr 속성값 (9) | 새 | 2025-05-25 |
| 2695905 | ASP로 개발됐을 때 css가 달라져요 ㅠㅠ (4) | 슬아라 | 2025-05-24 |
| 2695878 | form을 이용한 다른 페이지로 넘기는 방법을 알려주세요 (1) | 핫파랑 | 2025-05-24 |
| 2695844 | 저기 암호화 및 복호화 프로그램.. 만들어볼려는대 (2) | 한빛 | 2025-05-24 |
| 2695814 | [질문] PDA에서 애플릿이 가능한가요? (1) | 봄시내 | 2025-05-24 |
| 2695785 | 웹 설정 도와줄분 | 화이트캣 | 2025-05-23 |
| 2695730 | 갑자기 기억이 안나는데 accesskey 속성.. | 빛나라 | 2025-05-23 |
| 2695702 | [질문] Java 버전 차이에 의한 오류?!! (2) | 검사 | 2025-05-23 |
| 2695672 | 자바 임베디드 쪽으로 배우고 싶은데요..질문이요.. (1) | 뽀그리 | 2025-05-22 |
| 2695647 | 헉! 이클립스(v3.1)에서 발생되는 널포인트 익셉션? ;;; (3) | 아빠몬 | 2025-05-22 |
| 2695586 | IFRAME 캐싱 질문 | 봄나비 | 2025-05-22 |
| 2695498 | [질문]실행가능한 jar파일.. 정말 이해가 안가네요... ㅡㅜ;; | 터1프한렩 | 2025-05-21 |