게시판을 만들고있는데 최신게시물에 보이는 제목 크기가 너무 깁니다

게시판을 만들고있는데 최신게시물에 보이는 제목 크기가 너무 깁니다

QA

SIR 제작의뢰 - 견적무료/익명보정/호스팅, DB 이전/단기개발. 이젠 ' 의뢰인'이 원하는 '제작자'에게만 연락처를 알릴 수 있습니다.

게시판을 만들고있는데 최신게시물에 보이는 제목 크기가 너무 깁니다

본문

http://rosookwan0.dothome.co.kr/ 

이 주소인데 중간 유튜브 제목이 (테스트3)인데 f12로 확인해보면 제목 크기가 너무 길어서

쓸모없이 오른쪽 공백이 너무 큽니다.이 게시물 제목 크기를 줄이는 법이 있을까요?



저 latest.ski.php 는


<?php

if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가

include_once(G5_LIB_PATH.'/thumbnail.lib.php');


// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨

add_stylesheet('<link rel="stylesheet" href="'.$latest_skin_url.'/style.css">', 0);


$gallery_width = '120';

$gallery_height = '90';

?>


<!-- <?php echo $bo_subject; ?> 최신글 시작 { -->

<div class="lt">


<div class="skinmall-body">

    <ul class="row">

    <?php for ($i=0; $i<count($list); $i++) {  ?>

        <li class="col-xs-4 col-sm-3">

            <div class="thumb">

                <?php

/// echo $list[$i]['wr_link1'];

$pattern = "=";

$splitArr = split($pattern,$list[$i]['wr_link1']);

//echo $splitArr[1];

                $thumb = get_list_thumbnail($bo_table, $list[$i]['wr_link1'], $gallery_width, $gallery_height);


                echo "<a href=\"".$list[$i]['href']."\">";

                if($thumb['src']) {

                    $img_content = '<img src="'.$thumb['src'].'" alt="'.$thumb['alt'].'">';

                } else {

                    // $img_content = '<img src="'.$latest_skin_url.'/img/image_not_available_300.jpg" alt="'.$thumb['alt'].'" >';

// $thumb = get_list_thumbnail($bo_table, $list[$i]['wr_link1'], $gallery_width, $gallery_height);

$youtubeThumbPath = "https://img.youtube.com/vi/".$splitArr[1]."/default.jpg";

$img_content = '<iframe width="120" height="90" src="'.$youtubeThumbPath.'" frameborder="0"></iframe>';

                }


                echo $img_content."</a>";

                 ?>

            </div>

            <?php

            //echo $list[$i]['icon_reply']." ";

            echo "<a href=\"".$list[$i]['href']."\" class=\"ellipsis\">";

echo "";

            if ($list[$i]['is_notice'])

                echo "<p align='center'><strong>".$list[$i]['subject']."</strong></p>";

            else

                echo "<p align='center'>".$list[$i]['subject']."</p>";

            echo "</a>";

             ?>

        </li>

    <?php }  ?>

    <?php if (count($list) == 0) { //게시물이 없을 때  ?>

    <li>게시물이 없습니다.</li>

    <?php }  ?>

    </ul>

    </div>

</div>

<!-- } <?php echo $bo_subject; ?> 최신글 끝 -->











이거구 style.css는




@charset "utf-8";

/* SIR 지운아빠 */


/* 새글 스킨 (latest) */

.skinmall {

    margin-bottom: 20px;

    background-color: #fff;

}

.skinmall-heading {

display:block;padding:10px 0 8px

}

.skinmall-default>.skinmall-heading {

    color: #333;

    background-color: #fff;

    border-color: #f5f5f5;

}

.skinmall-default>.skinmall-heading a {

    display: inline-block;

    border-bottom: 3px solid #333;

    padding: 3px 15px 3px 0;

    margin-bottom: -3px;

    color: #000;

    font-weight: bold;

}

.skinmall-body {

    padding: 5px 0;

}

.skinmall-body ul {

    margin: 0;

    padding: 0;

    list-style: none;

}

.skinmall-body li {

    margin: 0;

    padding: 0;

}

.skinmall-body li .thumb {

    display: inline-block;

    width: 120;

    margin: 0;

    border: 1px solid #ededed;

}

.skinmall-body li .thumb img {

    display: -webkit-box;

    max-width: 90%;

    height: auto;

    margin: 5% auto;

}

.skinmall-body li .thumb iframe {

    display: inline-block;

    width: 120;

    height: 90;

    margin: 0;


}

.skinmall-body li a {

    color: #333;

    font-size: 0.95em;

    width: 90%;

    margin: 0 auto;

}

.lt_pc {float:left;margin-left:20px}

.lt {position:relative;float:left;margin-bottom:20px;padding-bottom:10px;width:300px;height:450px;border-bottom:1px solid #e9e9e9}

.lt strong {border:1px solid #ddd;}

.lt ul {padding:10px;margin:0 0 10px;list-style:none}

.lt li {padding:3px 0}

.lt .lt_title {display:block;padding:10px 0 8px}

.lt .lt_title > a {margin-left:10px;}

.lt .lt_more {position:absolute;top:10px;right:10px}

.lt .cnt_cmt {display:inline-block;margin:0 0 0 3px;font-weight:bold}


이거입니다!

이 글을 내 페이스북 계정으로 보내기 이 글을 내 트위터 계정으로 보내기 이 글을 내 구글플러스 계정으로 보내기

이 질문에 댓글 쓰기 :

답변 6

채택됨

인아이디어님의 답변

안녕하세요. 인아이디어입니다.


css 만으로도 처리가능합니다.


.sh_latest_post dd.caption {
	padding: 10px 0 15px;
	font-size: 1.4em;
	width: 100%;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	max-width: 80%;
}


.sh_latest_post dd.caption 의 css 를 변경해주시면 됩니다. 

단 글자가 길면 ... 으로 처리됩니다.


제가 질문을 제대로 이해한건지 모르겠네요 :(

주소복사
채택됨
답변의 댓글

플래토님의 답변

.lt {position:relative;float:left;margin-bottom:20px;padding-bottom:10px;width:300px;height:450px;border-bottom:1px solid #e9e9e9} 
//위와 같은것을


//아래와같이 변경해보세요
.lt {position:relative;float:left;margin-bottom:20px;padding-bottom:10px;width:150px;height:450px;border-bottom:1px solid #e9e9e9} 



틀 자체가 커서 그런경우로 보입니다.


주소복사
답변의 댓글

오수관님의 답변

1cc6269bec3321d75275d9578fe7f017_1507822461_2197.png
 

답변 감사합니다ㅠ변환했는데도 그대로입니다

f12눌러서 확인해보면 저런식으로 제목 자체가 너무 길어서 그런 것 같습니다ㅠ

해결법 있을까요??

주소복사
답변의 댓글

오수관님의 답변

아뇨 3번만 말하는게 아니라 다 그런데 예를들어 말씀드린겁니당ㅠㅠ

그룹 자체를 다 줄여봐도 변함이 없습니다ㅠㅠ

주소복사
답변의 댓글

플래토님의 답변

그리고
그 제목 타이틀에 적용하신 부트스트랩 클래스 2개중 하나를 빼보세요
li 태그에 있는 col-sm-3 이었나 했던것만 놔두시고
주소복사
답변의 댓글
답변을 작성하시기 전에 로그인 해주세요.
전체 52,613 | RSS
고마운 분의 도움으로 질문을 해결하셨다면, 채택을 눌러서 감사의 마음을 전하세요.
어떻게 질문해야 할지 모른다면 질문하는 방법을 읽어 보신후 질문해 보세요.
QA 내용 검색

회원로그인

진행중인 포인트경매

  1. 영카트 NEW 관리자모드 50% 할인쿠폰

    참여0 회 시작17.10.20 21:39 종료17.10.21 12:10
  2. 보성 레드키위 2kg

    참여82 회 시작17.10.19 10:54 종료17.10.24 10:54

(주)에스아이알소프트 (06253) 서울 강남구 강남대로 310, 1312호 (역삼동, 유니온센터) 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT