채택완료

아래 줄이 생기는데요.

아래와같이 탭메뉴를 만들어 봤습니다.

 

그런데

메뉴 아래로 라인이 생기더라구요.

다른 라인도 있고 곂쳐버리니 두꺼워지고 약간의 사이가 벌어집니다.

 

라인이 안생기고 여백이 안생기게 하려면 어떻게 해야 할까요?

 

조언 좀 부탁드립니다.

 

2084199297_1562568938.0414.jpg

Copy
<div class="pull-right">
    <ul class="nav nav-tabs">
        <li>
            <a href="./board.php?bo_table=#">메뉴1</a>
        </li>
        <li>
            <a href="./board.php?bo_table=#">메뉴1</a>
        </li>
    </ul>
</div>
|

답변 3개 / 댓글 4개

채택된 답변
+20 포인트

<div style="padding:0; line-height:1; "><!-- 전체박스 가로 긴 언더라인이 있는 부모 박스 -->
    <div style="margin:0;">오른쪽 빨간 동그라미 쳐진 박스</div>
    <div style="border-width:0 !important;">왼쪽 빨간 언더라인 메뉴를 감싸는 박스</div>
</div>

 

질문의 코드에 적용해보면

<div class="pull-right"  style="padding:0; line-height:1; ">
    <ul class="nav nav-tabs" style="margin:0; padding:0;">
        <li style="margin:0;">
            <a href="./board.php?bo_table=#">메뉴1</a>
        </li>
        <li style="margin:0; border-width:0 !important;">
            <a href="./board.php?bo_table=#">메뉴1</a>
        </li>
    </ul>
</div>

답변에 대한 댓글 2개

답변 감사합니다.
코드 적용해주신 것 해봤지만 아무 변화가 없어요 ^^
적어드린 코드는 예시를 들어드린 것이고... 응용해보시란 것인데 그대로 해버리셨군요 ^^;
정확히 라려면 저 DIV에 붙은 class="pull-right" 같은것을 알아야 되요.
아래코드만 써 놓고 실험을 해보세요.
그럼.... 이해가 가실테고... 그러면 그것을 적용하시면 되요.
ul li 태그를 적용하지 않은 이유는 그건 더 코드가 길어져서 그래요....
아래코드 실험해보세요.

<style>
.imsi-class:after { content:""; display:block; float:none; clear:both; } /*부모박스 크기 반응 */
</style>
<div class="imsi-class" style="padding:0; line-height:1; border:1px solid black;"><!-- 전체박스 가로 긴 언더라인이 있는 부모 박스 -->
<div style="margin:0; border:1px solid red; float:left;">오른쪽 빨간 동그라미 쳐진 박스</div>
<div style="border-width:0 !important; border:1px solid green; float:right">왼쪽 빨간 언더라인 메뉴를 감싸는 박스</div>
</div>

답변에 대한 댓글 1개

감사합니다. f12누르고 개발자 모드 봐도
안나타나는 것인지 못 찾는건지 안보이더라구요. ^^

해당 내용만으로는 어디를 수정해야 할지 알 수 없습니다

해당부분 css에 border-bottom으로 경계선이 그어져있는듯 하네요

찾아보세요

답변에 대한 댓글 1개

css를 찾아보니 border-bottom 많이 보이더라구요.
하나씩 0으로 해줘봐도 변하지 않았어요.

답변 감사합니다.

답변을 작성하려면 로그인이 필요합니다.