![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?5a7ff87)
Yahoo検索結果の、関連検索では、
文字列が中途半端のところでは折り返さず、
きちんとまとまりで折り返してくれます。
(例として以下をあげてみます。
http://search.yahoo.co.jp/search?p=google+%E3%82 …
画面の幅を変えて見ると、
たとえば、
「google ストリートビュー 芸能人」
は、
「google ストリートビ」
「ュー 芸能人」
のように折り返すことはありません。
一方、普通は、たとえばこの関連検索の最後にある、「で検索」
の部分のように、で/検/索
のいずれでも切れてしまうものなのですが。)
これはどのようなCSSを書けば可能でしょうか。
よろしくお願いします。
No.2ベストアンサー
- 回答日時:
#1です。
今やっと正確な質問の意味がわかりました。検索結果の説明文章の事だと思いましたが
一番下の虫がねアイコンの類似語句の検索メニューの事ですね?
例の「google ストリートビュー 芸能人」部分のリンクメニューを見落としていました。100件検索表示なので下まで見ていませんでした。失礼。
単なる文章なら折り返しますが
その部分は、仰る通りどんな環境でも折り返しません。
その部分のCSSは
a { white-space: nowrap } アンカーに対しての nowrap です。
メニューでしたら li の float 設定 + nowrap が一般的です。
h1,strong { white-space: nowrap }
なんてのも強調部分が読みやすくていいかもしれませんね。
質問がわかりづらくてすみません、おっしゃるとおりです。
おかげさまで解決いたしました。
white-space: nowrapがこのように便利に使えるとわかり
またひとつ疑問が解消しました。
ありがとうございます。
No.1
- 回答日時:
google ←のような英単語は、IE以外では折り返しません。
google ストリートビ
ュー 芸能人 ←これは無いと書いていますが折り返します。
widthで幅が決まっていればその幅内で収まる分は折り返しされません。
幅が決まっていなければブラウザの幅を狭くすると折り返します。
日本語は、折り返してしまうので折り返したくない単語があれば
折り返し禁止にします。
<span style="white-space: nowrap">google ストリートビュー 芸能人</span>
もしくは、p を pre に変更して文章を書く。
<pre>
google ストリートビュー 芸能人
</pre>
日本語なので、新聞や本でも単語の途中で折り返すのが一般的ですので
メニュー以外は、そんなに気を使うことも無いと思いますが。
この回答への補足
>これは無いと書いていますが折り返します。
ということですが、そうでしょうか...?
私の環境では折り返さないようです。
(私はFirefox3,IE6,IE7,Operaで確認しました。)
質問の仕方が悪かったかもしれないので、
もう一度ほかの例で詳しく述べてみます。
例として、
http://search.yahoo.co.jp/search?p=%E3%82%B9%E3% …
ですと、ウィンドウ幅を十分な程度に広げたとき、
----------------------------------
一行目
スタイルシート テンプレート, css スタイルシート, ホームページ スタイルシート, html スタイルシート
二行目
みんカラ スタイルシート, スタイルシート リンク, スタイルシート 無料, スタイルシート テーブル
三行目省略
----------------------------------
と現在のところなっています。
(見やすくするためコンマ","をいれました。)
これを、幅を縮めていくと、
----------------------------------
一行目
スタイルシート テンプレート, css スタイルシート, ホームページ スタイルシート, html スタイルシー
二行目
ト, みんカラ スタイルシート, スタイルシート リンク, スタイルシート 無料, スタイルシート テーブル
----------------------------------
↓さらに縮めると
----------------------------------
一行目
スタイルシート テンプレート, css スタイルシート, ホームページ スタイルシート, html スタイルシ
二行目
ート, みんカラ スタイルシート, スタイルシート リンク, スタイルシート 無料, スタイルシート テーブル
----------------------------------
...のように折り返されていくのが普通(?)だと思うのですが、
そうはならず、
----------------------------------
一行目
スタイルシート テンプレート, css スタイルシート, ホームページ スタイルシート
二行目
html スタイルシート, みんカラ スタイルシート, スタイルシート リンク, スタイルシート 無料
----------------------------------
という様に、柔軟に変動してくれます。
これは何かうまいCSSの書き方によって実現しているのではないかと思う次第です。
すみません、おっしゃるとおり
white-space: nowrap;
を書くことで思ったとおりの結果を得られました。
上記の補足を書いた後に気付きました。失礼いたしました。
こちらのサイトがまさに私のしたいことを紹介してくれていて、大変参考になりました。
http://css-happylife.com/log/css-template/000717 …
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- iPhone(アイフォーン) こちらWEB検索できるかが分かりません それからこちらの最安値があれば教えてください https:/ 2 2022/09/14 14:09
- ノートパソコン なんでこんなに安いんですか?大丈夫? 6 2023/04/21 22:28
- Android(アンドロイド) Pixel 3a のアップデート7月配信は嘘? 1 2022/08/22 11:49
- その他(パソコン・スマホ・電化製品) Google ドライブのようにXnBay ストレージ サーバのストレージスペースをコンピュータのエク 2 2023/04/28 19:09
- 洋画 「トラ・トラ・トラ!」の字幕 3 2022/10/17 01:15
- Android(アンドロイド) ワンセグの視聴に加えて、録画に対応したらくらくスマホを探しています。 ありますか?? あるなら教えて 1 2023/05/12 21:20
- 事件・事故 「テロリストの女王」重信房子が刑期満了で出所へ 5 2022/05/27 17:13
- その他(占い・超常現象) 五鈷杵付きオニキスと三眼天珠、どっちのブレスレットが良いか? 1 2022/06/25 20:53
- その他(生活家電) 電熱ヒーターパッド(17×24cm)の電源がすぐに切れるので困っています。 2 2022/12/20 13:31
- FTTH・光回線 皆さんのインターネット回線速度はどれくらいですか? 6 2022/10/29 23:13
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
二文字読みの苗字を出来るだけ...
-
「辻」を点が一個のつじへの変...
-
小池栄子が怖いんですけど、私...
-
辻と点二つのつじ、どちらが正...
-
綾瀬はるかさんは下痢する事あ...
-
篠田麻里子がAV出演する事にな...
-
頭60センチの芸能人は?
-
お箸の持ち方がおかしな芸能人...
-
芸能人のイニシャルで横文字で...
-
芸能人はピルを飲まないのか?
-
あなたのやりまくりたい芸能人...
-
湘南乃風「覇王樹」PVの男の人
-
大物の芸能人が亡くなったとき...
-
プロの女性の方に質問です。
-
仲里依紗って、上品ですか? 下...
-
『つじむかい』とは?
-
森高千里と中山美穂どっち見て...
-
キン肉マン好き芸能人を教えて...
-
契約
-
ソース顔とバター顔の違いは?
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
二文字読みの苗字を出来るだけ...
-
頭60センチの芸能人は?
-
キムタク長女がYOSHIKIに激似
-
「辻」を点が一個のつじへの変...
-
辻と点二つのつじ、どちらが正...
-
kokiさんてそんなにスタイルい...
-
篠田麻里子さんの 不倫が話題に...
-
舌足らずな喋り方をする女性芸...
-
学校紹介または学校全体でテレ...
-
実物はイケメンや美人なのに写...
-
作家・阿川佐和子さんの事務所...
-
ガーシーの言うてることは本当...
-
MEGUMI、杉原杏璃、小池栄子の...
-
皆さんは昔の綾瀬はるかがデブ...
-
芸能界は竿兄弟、穴兄弟が多い...
-
「着信アリ」を解説してください
-
『つじむかい』とは?
-
アンケート&ネタ募集!
-
たくあん樽にかびが
-
ジャニーズのSexy zoneのセンタ...
おすすめ情報