- ベストアンサー
<li>内の<ul>を横に表示する方法
SAYKAの回答
- SAYKA
- ベストアンサー率34% (944/2776)
inline化するかfloatを使うとできるんじゃないかな。 http://www.tohoho-web.com/css/reference.htm#display http://www.tohoho-web.com/css/reference.htm#float
関連するQ&A
- ＣＳＳでulとliを指定し横に並べたいです。
ulとliを使っても横に表示できる方法わかる方教えてください。 例 <ul> <li>あああ</li> <li>いいい</li> <li>ううう</li> <li>えええ</li> </ul> 普通は ・あああ ・いいい ・ううう ・えええ となってしまいますがこんな感じで作りたいのですが。 ・あああ ・いいい ・ううう ・えええ みたいに横にしたのですがどうやってやればいいかわかりません（泣） たぶんＣＳＳで指定するのかと思ってますが、違うんでしたらそのやり方を教えてください。
- ベストアンサー
- HTML
- ul・liについて
ul・liを使って <ul> <li>みかん</li> <li>りんご</li> <li>レモン</li> </ul> というリストをつくったのですが(リストマークなし)、FirefoxとIEでは表示がだいぶずれてしまいます。（各行のインデントが発生する） これって妥協するしかないんですかね？ ご回答よろしくお願いします。
- ベストアンサー
- ホームページ作成ソフト
- ulとliを指定し横に並べて
テキスト2行、5個のリストをHTMLとCSSとjavascriptでulとliを指定し横に並べて、 2秒間1個のテキストのリストで止まって2秒たったら次のテキストのリストに動く スクリプトの作り方が知りたいです。
- ベストアンサー
- JavaScript
- <ul>タグで各<li>の中身を横方向羅列させつつ各項目を等幅に。
<ul>タグで各<li>の中身を横方向羅列させつつ各項目を等幅に。 以下のように、ulですが、横方向に羅列して表示される、 htmlソースと、CSSソースがあります。 で、これをもとにしつつ、（あるいはもとにしなくてもいいのですが）、 各項目・・・下の例では、 [サイトマップ] [ヘルプ] [お問い合わせ] の３つそれぞれを、等幅にして表示させたく思っています。 条件としては・・・ ●<ul>を使うことは必須。 ●cssハック的なものを使ってもかまいません。 ●できればJavaScriptを使いたくないですが、やむを得ない場合は、OKです。 ●もしやむをえなければ、たとえば、「各項目の、等幅化する前のwidthは、7em以内でないといけない」 などの条件がついてもかまいません。 以前、できたような気がするのですが・・・やりかたを忘れてしまいました。 ご存じのかたいらっしゃいましたら、お教えいただければ幸いです。 よろしくお願いいたします。 //----------------------------------------------------------- ＜html ソース＞ <ul class="miya-ul_lateral"> <li class="miya-li_lateral_first">サイトマップ</li> <li>ヘルプ</li> <li class="miya-li_lateral_last">お問い合わせ</li> </ul> //----------------------------------------------------------- ＜cssソース＞ /* 1st step: */ ul.miya-ul_lateral li{ display:inline; list-style-type:none; padding:0 2px 0 5px; margin:0; border-left:1px solid #000; } /* /1st step: */ /* 2nd step: */ ul.miya-ul_lateral li.miya-li_lateral_first{ border-left:0; padding-left:0; } /* 2nd step: */ /* 3rd step: */ ul.miya-ul_lateral li.miya-li_lateral_last{ padding-right:0; } /* 3rd step: */ よろしくお願いいたします。
- ベストアンサー
- HTML
- ｃｓｓの記述について教えてください、<ul><li>
ｃｓｓの記述について教えてください。勉強不足で<li>タグだけなら正常に表示できるのですが、無理に<ul>タグを追加すると型崩れしてしまいます。<ul>タグは必須としていれなくてもいいですか？？<li>タグのみで
- ベストアンサー
- ホームページ作成ソフト
- エクセル グループごとの検索について
グループごとを検索し、その情報を縦列に表示したいのですが、悩んでおります。 横に表示するのは、以下の関数を使って出来たのですが、 =IF(ISNA(MATCH(COLUMN(A4)&$A4,sheet1!$E$2:$E$700,0)) これだと使い勝手が悪く、困っております。 例えば (sheet1)の情報を、 品種 品名 金額 産地 果物 りんご１ ２００ 津軽 果物1 果物 りんご２ ２５０ むつ 果物２ 果物 みかん ３００ 果物３ 果物 ぶどう ４００ 果物４ ーーーーーーーーーーーーーーーーーーーーーーーー 海外果物 パパイヤ ３００ 海外果物１ 海外果物 アドカボ １００ 海外果物2 海外果物 バナナ １３０ 海外果物3 ーーーーーーーーーーーーーーーーーーーーーーーー 野菜 なす １００ 野菜1 野菜 にんじん ２００ 野菜2 野菜 きゃべつ ３００ 野菜3 野菜 大根 １５０ 練馬 野菜4 野菜 大根２ １８０ 京都 野菜5 (sheet2)において ［A］又は［B］のある位置のセルに、品種(この場合、野菜)を打ち込むと、 ［ A ］ ［ B ］なす １００ にんじん ２００ きゃべつ ３００ 大根 １５０ 練馬 大根２ １８０ 京都 このように、品名と値段、産地が縦に並んで欲しいのです。 どうぞお知恵を貸して下さいませ。 宜しくお願いします。
- ベストアンサー
- オフィス系ソフト
- CSSで<ul><li>タグを使ってどのブラウザでも同じように表示させたい。
.ul { width: 120px; height: auto; float: left; font: 12; line-height: 150%; padding: 0; list-style-image: url(img/side-tab.gif); } .li { font-size: 12px; margin-left: 1.5em; } <ul class="○○○"> <li>１１１１１</li> <li>２２２２２</li> <li>３３３３３</li> <li>４４４４４</li> <li>５５５５５</li> <li>６６６６６</li> </ul> このようなコードでlistの頭には画像を使いたいのですが、どうしてもブラウザごとに表示がばらばらになってしまいます。 横幅は185pxまででおさめて、かつlistの画像とテキストが同じ列に表示されるようにしたいと考えています。 唯一firefoxだけが思うように表示できました。 IE６と７でも違う表示になりました（IE6だとかなり右寄り） operaに関しては画像とテキストの縦位置がずれてしまっていました。 CSSに関してはいろいろいじってて、なにがなんだがわからない状態になってしまいました・・ これを一つのCSSできれいに表示することは不可能でしょうか？ どうかよろしくお願致します。
- ベストアンサー
- HTML
- tableにul,または,olを入れられますか？
<table> <tbody> <th>くだもの</th> <td><ul><li>りんご</li><li>みかん</li><li>すいか</li></td> …etcとして くだもの ・りんご ・みかん ・すいか としたいのですが、 <table>の<tbody>の<td>の中に<ul>の<li>を入れる方法は HTMLの仕様に反していますでしょうか？
- ベストアンサー
- ホームページ作成ソフト
- ul li を使ったリストを作りたいんですけど。。。
CSS初心者です。 ul liを使ってこんな感じのリストを作りたいんですけど うまくいきません。 ↓ ------------------------------------ ああああ いいいい うううう ええええ おおおお かかかか きききき くくくく けけけけ ここここ ささささ しししし すすすす せせせせ そそそそ ------------------------------------ なんとか作ってはみたんですが、IE7ではなんとかそれらしく 表示されますが、Opera9で確認すると うまく表示されません。 （「あ」の後に改行されずに「い」がきてしまったり・・・） すいません。 どなたか分かる方がいれば教えてください。 よろしくお願いします。
- ベストアンサー
- HTML
- <LI>タグで横に表示したい
今、ホームページを作っているのですが LIタグを用いて、どうしても横に表示したい部分があるのです。 普通なら <UL> <LI>あ <LI>い <LI>う </UL> で ・あ ・い ・う と表示されるのを あ い う ・・・のように・・・ http://kabocha.org/wangando/index.html このサイトのスタイル選択で、「斜めの見出し」を選択すると そのようになるのですが これと全く同じことをしたいのです。 教えてください！ ここまでこだわってる理由は、上記のサイトでも使われている いちゆうさんの、スタイルシート切り替えスクリプトを使いたいからです。 http://critical.s6.xrea.com/web/cssselect.shtml
- ベストアンサー
- HTML
補足
floatは次のに試してみましたができませんでした。 <ul> <li style="float:left">野菜 <ul style="float:left"> <li>大根 <li>にんじん </ul> </li> <li style="float:left; clear:both;">果物 <ul style="float:left"> <li>りんご <li>バナナ </ul> </li> </ul> inline化も以下のようにしてみましたが、ダメでした。 <ul> <li style="display:inline">野菜 <ul> <li>大根 <li>にんじん </ul>