タグ・デザイン掲示板

[

名前変換後の名前を分割したい
by みたき

2015-12-20 12:36
「名前変換分割」「og3タグ」等で検索しましたが見付からなかったので質問致します。

名前変換小説で名前変換をしたあとの名前を更に分割させたいです。
例えば、名前変換後の名前が「みたき」だとすると、「み……たき」のように分割するように表示させたいです。

<style type="text/css">
.namecut{ display: inline-block; overflow: hidden; white-space: nowrap; vertical-align: bottom; text-indent: 0; }
.first{
width: 1em;
margin-right: 2px;
}
.no_first{
margin-left: -2px;
}
.no_first:before{ content: ''; margin-left: -1em; }
</style>

のタグをHEAD内に入れ、小説の内容のページに

「<span class="namecut first">#なまえ#</span>……<span class="namecut no_first">#なまえ#</span>」

と入れたのですが、小説ページを見ると

「
みたき……
みたき」

と表示されてしまいます。
どうしたら良いでしょうか？

SH001
[編集]

by 66

2015-12-20 14:37

試してみましたが、ちゃんと表示されました。
試した時のHEADの情報は以下です。

PC/Google Chrome

文書型宣言(<!DOCTYPE>)は
　<!DOCTYPE html>
HTMLタグ(<html>)は
　<html lang="ja">
HEAD内は
　みたきさんのCSSのみ
BODYタグ(<body>)は
　<body>
XHTML変換は
　しない

pc
[編集]

by og3

2015-12-20 15:56
製作者です。
配布時には一応書いておいたのですが(再配布可にしているのと初回配布時が掲示版への書き込みだったのでタグだけちょっと独り歩きしています)、ネガティブマージンと呼ばれるものを使用しているので非対応のブラウザ(ガラケー等)だと表示が崩れる等の問題があります。

正直どうしようもないのでナノで使うならば独自タグで文章の違和感を無くすしかないと思われます。

▼HEAD
<style type="text/css">
<nopc>

.nopc{
display: none;
}

</nopc>
<pc>
.namecut{
display: inline-block;
overflow: hidden;
white-space: nowrap;
vertical-align: bottom;
text-indent: 0;
}

.first{
width: 1em;
margin-right: 2px;
}

.no_first{
margin-left: -2px;
}

.no_first:before{
content: '';
margin-left: -1em;
}

</pc>
</style>

▼HTML
<span class="namecut first"></span>か<span class="namecut no_first"></span>
で、ガラケー表示させたくない方を
<span class="nopc namecut first"></span>
<span class="nopc namecut no_first"></span>
に変更してみてください。

pc
[編集]

by みたき

2015-12-20 16:52
お二方、レスありがとうございます。

やはりガラケーだと、そのように崩れて表示されてしまうのですね。ありがとうございます、参考になりました。

og3様、すみません、貴方のテンプレートを探したのですが、どう探せば良いのか分かりませんでした。何と検索したら出ますでしょうか。

SH001
[編集]

[