- ベストアンサー
CSSの変更点とは?
- CSSの変更点を教えてください。自分のホームページにBeautiful CSS buttons with icon setを使いたいが、縦並びではなく横並びにしたいと思っています。display:block;をいじればいいのか試してみましたが、うまくいきません。
- CSSの変更について教えてください。ホームページにBeautiful CSS buttons with icon setを使いたいが、縦並びではなく横並びにしたいと思っています。display:block;をいじってみましたが、表示が乱れてしまいます。
- CSSの変更方法を教えてください。自分のホームページにBeautiful CSS buttons with icon setを使いたいが、縦並びではなく横並びに表示したいです。display:block;を変更したり試してみましたが、うまくいきません。
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
その他の回答 (1)
関連するQ&A
- テキストボックスを横並びで表示
テキストボックスを2つ作り横並びに表示したいのですがどうしても縦ならびに表示されてしまいます。 display:inlineをCSSで入れても変化がありません。 <input style="display: inline;" type="text" name="post_1" value="<?=$_SESSION["post_1"]?>">-<input style="display: inline;" type="text" name="post_2" value="?=$_SESSION["post_2"]?>"> 他に関係する要素はあるのでしょうか?
- ベストアンサー
- HTML
- どう変更してもIE6だけCSSレイアウトが崩れてしまいます。
CSSレイアウトで、サイトを作成していたのですが、 最近になってIE6で確認してみると、レイアウトが崩れまくっていました。。。 3カラムレイアウトなのですが、Firefox等他のブラウザではきちんと表示されるので、なぜかIE6だけ縦1列になってしまいます。。 こちらのサイトでもIE6はレイアウトが崩れやすいという情報がたくさんあり、そちらのアドバイスを参考にしながら1日かけてがんばってのですが、できませんでした。もう限界です(涙) 現在のCSSは、 * { margin:0; padding:0; } .wrapper { width: 740px; margin: 0 auto; } .header { width: 740px; } .main { width: 740 px; /* 両端ブロックとコンテンツを囲んでいるクラスです。 */ } .menu {display: inline; float: left; width: 205px; } .contents {display: inline; float: left; width: 385px; } .affiliate {display: inline; float: left; width: 150px; } .footer { clear: both; width: 740px; } というような状態です。 どなたかアドバイスいただけますと大変幸いです。 よろしくお願いいたします。
- ベストアンサー
- HTML
- cssについて質問です。
ホームページ作成の勉強をしている者です。 分からないことがあるので質問させてもらいます。 http://www.htmq.com/csskihon/401.shtmlこのサイトのcssのソースに float:left; /*リスト項目を横に並べる*/ display:inline; /*リスト項目をインライン表示にする*/ こう書かれていました。 display:inline;ですでにリストが横になるので、float:left;で横に並べる必要があるのですか? 調べてもいまいち納得いく答えが見つからないので分かる人教えてください。
- 締切済み
- CSS
- くの字点のcss
以下をcssにしてくの字点を出す方法を教えてください <span style="display:inline-block; line-height:1em; vertical-align:middle; -ms-writing-mode: rl-tb; -webkit-writing-mode: horizontal-tb; writing-mode: horizontal-tb; layout-flow:horizontal; text-orientation:upright; -webkit-text-orientation:upright;"><span style="display:block">〳</span><span style="display:block">〵</span></span>
- ベストアンサー
- CSS
- CSSのブロックレベルとインラインレベル
今CSSをやろうとしているのですが diplayタグがいまいちわかりません display:inline disilay:blockでは インラインレベル要素として使う ブロックレベル要素として使うと 参考書には書いてありました それでインラインとブロックレベル要素とはなんでしょうか? そもそも要素自体よくわかってないのですが この二つの違いがよくわかりません
- ベストアンサー
- CSS
- CSSで横に伸縮するボタンについて
参考サイトを基にして、横に伸縮するポタンをCSSで 作っており、FireFox2.0ではうまく表示されるのですがIE6および7では右側が切れて表示されてしまい困っております。 どなたかご存知の方、作成中のHTMLを掲載いたしますので、「このプロパティ部分が抜けている」等ご指摘願えませんでしょうか? ●参考サイト http://www.hedgerwow.com/360/dhtml/css-round-button/demo.php ●サンプルHTML <div id="searchArea"> <a class="button active" href="#"> <span>あああああああああああああああ</span> </a> <a class="button" href="#"> <span>あああああ</span> </a> </div> <style> a.button { background:url(form_buttons.png) no-repeat 0 0; text-decoration:none; height:30px; color:#222; display:-moz-inline-box; display:inline-box; margin-right:8px; } a.button span { background:url(form_buttons.png) no-repeat right top; height:30px; display:-moz-inline-box; line-height:1; margin:0 -16px 0 10px; padding:8px 20px 0 10px; } a.button:hover { background-position:left -60px; } a.button:hover span { background-position:right -60px; } /*アクティブ*/ a.active { background:url(form_buttons.png) no-repeat left -120px; } a.active span { background:url(form_buttons.png) no-repeat right -120px; } </style>
- 締切済み
- CSS
- CSSで横並び→HTMLの記述は?
最近、独学でプログラミングを学び始めた初心者です。 で、HTML&CSSで「メニューリストを横並びにする」にする方法がわかりません。 どうしたら良いでしょうか? CSSでは、 /* すべてのページに適用 - navまわり - */ #nav li { display: inline; list-style-type: none; padding-right: 30px; } で合っていると思いますが、HTMLでは何が間違ってますか? 知識が浅くざっくりとした質問で申し訳ありません。 これだけの情報だと回答が難しいかもしれませんが、非常に困っております。 よろしくお願いします。
- 締切済み
- HTML
- プログラム CSS3 アニメーション
.text{ position: relative; display: inline-block; font-size: 2em; } .text:before{ position: absolute; top: 1.3em; left: 0; content: ""; display: inline-block; width: 0; height: 2px; background: #34BBF3; transition: 2s; } .text:hover:before{ width: 100%; } このプログラムはhttps://qiita.com/junya/items/4805404624292401030dからコピペしたCSS3のアニメーションを使ったアンダーラインのプログラムです。 このプログラムの四行目と九行目につかわれている「em」とはなんですか。
- 締切済み
- CSS
- プログラム CSS3 アニメーション
.text{ position: relative; display: inline-block; font-size: 2em; } .text:before{ position: absolute; top: 1.3em; left: 0; content: ""; display: inline-block; width: 0; height: 2px; background: #34BBF3; transition: 2s; } .text:hover:before{ width: 100%; } このプログラムはhttps://qiita.com/junya/items/4805404624292401030dからコピペしたCSS3のアニメーションを使ったアンダーラインのプログラムです。 このプログラムの十一行目の「content: "";」はどうして何も書かないんですか。 これをかいて何の意味があるんでしょう。
- 締切済み
- CSS
- CSS after before
.text{ position: relative; display: inline-block; font-size: 2em; } .text:before{ position: absolute; top: 1.3em; left: 0; content: ""; display: inline-block; width: 0; height: 2px; background: #34BBF3; transition: 2s; } .text:hover:before{ width: 100%; } このプログラムはhttps://qiita.com/junya/items/4805404624292401030dからコピペしたCSS3のアニメーションを使ったアンダーラインのプログラムです。 このプログラムの上から七行目に使われている before なんですが before はこのプログラムではどういゆ役割(仕事)なんですか。なぜ before なんでしょうか。
- ベストアンサー
- CSS
補足
ありがとうございます! やってみたのですが、横並びのメニューとメニュー間に空間ができないのですが、これはどうしたらよいでしょうか? (スペースを入れてもWebでみるとスペースがないので) あと、FireFoxでみると、何も見えなくなってしまいます。 これはどうしたらよいのでしょうか? 教えていただけたら嬉しいです。 よろしくお願いします。