cssロングデータのときにブレークする方法

私はここで多くの検索をしても問題は解決しないが、データが動的で、長めで短く短く短くて長いテキストでは問題ないそれはくちばしラインです。それは休憩ではなく、同じ行を引く（重複するテキストを作る）。私を助けてください、この本は私のHTMLcssロングデータのときにブレークする方法

Company name: <a id="com_name">REGIONAL COMMUNITY FORESTRY TRAINING CENTER FOR ASIA AND PACIFIC (RECOFTC)</a>

と私のCSS：

#com_name{ 
    font-size: 12px; 
    position: fixed; 
    width: 50%; 
    word-break: break-all; 
    white-space: normal 
}

が、私が欲しいこの

のように私の結果

Company name: REGIONAL COMMUNITY FORESTRY TRAINING CENTER FOR ASIA AND 
       PACIFIC (RECOFTC)

出典

2017-03-07 koe

use line-height：28px; – user7357089

はい私の問題は 'line-height'を追加することで解決します – koe

あなたのCSSでline-heightを設定します。

#com_name{ 
    font-size: 12px; 
    position: fixed; 
    width: 50%; 
    word-break: break-all; 
    white-space: normal; 
    line-height: 20px; 
}

出典

2017-03-07 04:55:30

はい、私の問題に感謝しました 'line-height'を使って解決しました – koe

line-height: 2;を使用してまたはline-height: 20px;

例 - 1：line-height: 20px;

#com_name{ 
    font-size: 12px; 
    position: fixed; 
    width: 50%; 
    word-break: break-all; 
    white-space: normal; 
    line-height: 20px; 
}

を使用して： line-height: 2;

#com_name{ 
    font-size: 12px; 
    position: fixed; 
    width: 50%; 
    word-break: break-all; 
    white-space: normal; 
    line-height: 2; 
}

#com_name{ 
 
    font-size: 12px; 
 
    position: fixed; 
 
    width: 50%; 
 
    word-break: break-all; 
 
    white-space: normal; 
 
    line-height: 2; 
 
}

Company name: <a id="com_name">REGIONAL COMMUNITY FORESTRY TRAINING CENTER FOR ASIA AND PACIFIC (RECOFTC) </a>

例 - 2を使用して

#com_name{ font-size: 12px; position: fixed; width: 50%; word-break: break-all; white-space: normal; line-height: 20px; }

Company name: <a id="com_name">REGIONAL COMMUNITY FORESTRY TRAINING CENTER FOR ASIA AND PACIFIC (RECOFTC) </a>

出典

2017-03-07 04:54:45

' line-height'を使って私を助けます – koe

私もこの問題に直面しました。あなたはword-wrapを使用できます。次の例を参照してください。

#dob{ 
 
\t font-size: 11px; 
 
\t display: inline-block !important;*/ 
 
\t vertical-align: middle !important;*/ 
 
\t color: #365899; 
 
    cursor: pointer; 
 
    word-wrap: break-word; 
 
    width: 158px; 
 
}

<div id="selectDob"> 
 
<select label="Day" name="birthdat_day" class="days" id="selectDateOfBirth"> 
 
<option value="0" selected="1">Day</option> 
 
</select> 
 
<select label="Month" name="birthday_month" class="months" id="selectDateOfBirth"> 
 
<option value="0" selected="1">Month</option> 
 
</select> 
 
<select label="Year" name="birthday_year" class="years" id="selectDateOfBirth"> 
 
<option value="0" selected="1">Year</option> 
 
</select> 
 
<div id="dobContent"> 
 
    <a href="#" id="dob" data-toggle="popover">Why do I need to provide my date of birth?</a> 
 
</div> 
 
</div>

出典

2017-03-07 05:13:39 user7397787

.class_name { 
    word-wrap: break-word; 
}

はあなた

出典

2017-03-07 05:13:43 Momin

使用

をありがとう...これを試してみてください

#com_name{ 
    word-break: break-word; 
    white-space: normal 
}

出典

2017-03-07 05:25:19

<html> 
    <head> 
    <style> 
    /*anchor tag*/ 
    #com_name{ 
     font-size: 12px; 
     width: 50%; 
     white-space: normal 
    } 

    /*set width for first p tag*/ 
    .first{ 
     width:8%; 
    } 

    /*set width, margin-top and margin-left for second p tag*/ 
    .second{ 
     margin-left:8%; 
     margin-top:-33px; 
     width:32%; 
    } 
    </style> 
    </head> 
    <body> 
    <p class="first">Company name:</p> 
    <p class="second"> <a id="com_name">REGIONAL COMMUNITY FORESTRY TRAINING CENTER FOR ASIA 
AND PACIFIC (RECOFTC)</a></p> 
    </body> 
    </html>

出典

2017-03-07 05:26:40

少しの説明が役に立つでしょう –

cssロングデータのときにブレークする方法

答えて

関連する問題