グリッドの崩れ対策

▲想定外の長文を書かれてしまった時のシュミレーションです。

対策は文字数の指定で‘mb_strimwidth‘

 <dd class="balloon1-top">
<?php 
　$str=$user["info"];
　$str=mb_strimwidth($str, 0, 90, '…', 'UTF-8');
　echo $str; 
　?>
</dd>

↓「90」は8バイト文字が90個なので日本語は半分です。
＜結果＞

コメントの高さを指定す￥る

スタイルシートをタグに記序して高さと幅を強制的に指定。
※バルーンのCCSを変更した方が美しいです。私はCSSを他のページで共有しているため直接記序しています。
<dd class=”balloon1-top” style=”height:70px;width:90%;”>
<?php
$str=$user[“info”];
$str=mb_strimwidth($str, 0, 90, ‘…’, ‘UTF-8’);
echo $str;
?>
</dd>

整いました。
後は全文を読みたい人のために、個別表示ボタンをつけたら完成です。
▼完成

 <dd class="balloon1-top" style="height:70px;width:90%;">
<?php
$str=$user["info"];
$str=mb_strimwidth($str, 0, 120, '…<br><a href="personal_view.php?id='.$user["id"].'">続きを読む</a>', 'UTF-8'); 
echo $str; 
?>
</dd>

 

PAGE TOP