상단 메인 메뉴에 마우스를 대면

밑으로 스르륵 내려오는 이차 메뉴 있지요.

 

거기에 요즘 보면 메뉴의 칸이 아래처럼 메뉴명이 꽉 차게 현재 되어있습니다.

1메뉴

2메뉴

3메뉴

4메뉴

서브메뉴1

서브메뉴2

서브메뉴3

서브메뉴4

 

 

위의 서브메뉴를 아래처럼 메뉴칸의 넓이를 좀 여유공간이 있게 보이고 싶은데...

 

1메뉴

2메뉴

3메뉴

4메뉴

서브메뉴1

서브메뉴2

서브메뉴3

서브메뉴4

위에처럼 좀 넉넉하게 보이도록.... ㅡㅡ;;

 

 

이렇게 하려면 해당레이아웃 CSS에서 무엇을 추가하고

어디를 수정해야 좋을지 힌트좀 주시면 감사하겠습니다.

 

부탁드립니다 고수님들~~

 

 

 

죄송합니다....

제가 완전 쌩 초보다 보니

 

ForHanbi 님이 답변주셨는데 제 실력이 미흡해서...ㅡㅡ;;

 

메뉴가 걸려있는 클라스명이나 아이디명 다음에 li li a {padding:0 20px 0 10px;} padding다음의 숫자는(상단 우측 아래 좌측)순서 알아서 수정하시면 될 듯 합니다.

 

 

위의 답변대로 여기저기 붙여봤는데...바깥쪽 셀은 넓어진듯한데...

 

안쪽 칸을 나눈 부분은 넓어지지 않네요 헐~~

다시 한번 부탁드려도 될까요?? ㅡㅡ;;

 

 

 

소스가 아래와 같던데요 ㅠㅠ;;

 

 

 

/* menuLine drop down sub menu */
.dmSubMenu { position:absolute; padding:0px; margin:0px; *margin:0px; border:1px solid #a2a4af; background:#fff; visibility:hidden; z-index:100; }
.dmSubMenu ul  {margin: 0; padding: 0; border: 1px solid #d3f5cc; overflow: hidden;}
.dmSubMenu ul li {list-style: none; border-top: 1px solid #d3f5cc; margin-top: -1px;}
.dmSubMenu ul li a { display:block; font:normal 12px dotum; color:#555; padding:7px 8px; _padding:7px 8px 5px 8px; margin:0px; }
.dmSubMenu ul li a:hover { color:#192221; text-decoration:none; background:#efefef; }
.dmSubMenu ul li.on{ margin:0px; padding:0px; border-bottom:none; }