탭메뉴 내용 이미지 크기 질문이용 채택완료

그그누누 6년 전 조회 3,627

답변 1

탭메뉴에 내용을 넣을때 이미지를 넣었는데 크기가 커서그런지 정해진 영역을 벗어납니다!!

이렇게요..

텍스트는 벗어나는 오류 없이 자동줄바꿈이 잘되는 상태입니다.

이미지가 영역안에만 있도록하려면 어떻게 해야할까요?

</p>

<p>//style.css에서 탭메뉴 관련 코드입니다.</p>

<pre>

#container {
    width:70%;
    margin: 1%;
    text-align:left;
}
body{
    margin-top: 100px;
    line-height: 1.6
}

ul.tabs{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
ul.tabs li{
    background: none;
    color: #222;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
    border:1px solid #ddd;
}

ul.tabs li.current{
    background: #ffebf4;
    color: #ff000b;
}

.tab-content{
    display: none;
    background: #ffffff;
    padding: 15px;
    border:1px solid #ddd;

}

.tab-content.current{
    display: inherit;
    background: #ffebf4;
    border:1px solid #ddd;
}
</pre>

<p>

#탭메뉴 #이미지 #크기

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

답변 1개

정렬:

채택된 답변

+20 포인트

작은별

6년 전

.tab-content img {max-width:100%;height:auto}

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

�

그그누누

6년 전

감사합니다!!

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

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

로그인

탭메뉴 내용 이미지 크기 질문이용 채택완료

답변 1개

답변에 대한 댓글 1개

공유하기